摘要:
今天想把潍坊人才网首页http://www.jobyuandu.com做个跳转,使用手机访问的用户直接跳转到wap上http://wap.jobyuandu.com,其他访客还是正常访问,使用了下面用一段js代码来搞定这个功能。在网页的顶部加入javascript判断代码:function checkserAgent(){ var userAgentInfo=navigator.userAgent; var userAgentKeywords=new Array("Android", "iPhone" ,"SymbianOS", &q 阅读全文
摘要:
上一篇文章分析了互联网的总体构思,从下至上,每一层协议的设计思想。这是从设计者的角度看问题,今天我想切换到用户的角度,看看用户是如何从上至下,与这些协议互动的。==============================================================互联网协议入门(二)作者:阮一峰(接上文)七、一个小结先对前面的内容,做一个小结。我们已经知道,网络通信就是交换数据包。电脑A向电脑B发送一个数据包,后者收到了,回复一个数据包,从而实现两台电脑之间的通信。数据包的结构,基本上是下面这样:发送这个包,需要知道两个地址: * 对方的MAC地址 * 对方的IP地址有.. 阅读全文
摘要:
我们每天使用互联网,你是否想过,它是如何实现的?全世界几十亿台电脑,连接在一起,两两通信。上海的某一块网卡送出信号,洛杉矶的另一块网卡居然就收到了,两者实际上根本不知道对方的物理位置,你不觉得这是很神奇的事情吗?互联网的核心是一系列协议,总称为"互联网协议"(Internet Protocol Suite)。它们对电脑如何连接和组网,做出了详尽的规定。理解了这些协议,就理解了互联网的原理。下面就是我的学习笔记。因为这些协议实在太复杂、太庞大,我想整理一个简洁的框架,帮助自己从总体上把握它们。为了保证简单易懂,我做了大量的简化,有些地方并不全面和精确,但是应该能够说清楚互联网 阅读全文
摘要:
如今的网页代码,一般由三个部分组成: * HTML,语义层,提供网页的内容。 * CSS,表现层,规定网页的外观。 * Javascript,动作层,定义用户与网页的互动。理想的开发环境,应该既可以分别调试这三种代码,又可以轻松查看它们合并在一起的整体效果。浏览器是最合适的效果查看工具,所以很多人想到,代码调试环境也可以直接部署在浏览器中,以网站的形式提供服务。下面,我根据Design Shack的文章,总结一下目前最常见的6种网页开发在线调试环境。它们大大方便了网页设计师的工作,极大地提供了工作效率。一、CSSDesk网址:http://cssdesk.com/(需FQ)这个网站是最早... 阅读全文
摘要:
CSS中背景图片的定位,困扰我很久了。今天总算搞懂了,一定要记下来。在CSS中,背景图片的定位方法有3种: 1)关键字:background-position: top left; 2)像素:background-position: 0px 0px; 3)百分比:background-position: 0% 0%;上面这三句语句,都将图片定位在背景的左上角,表面上看效果是一样的,实际上第三种定位机制与前两种完全不同。前两种定位,都是将背景图片左上角的原点,放置在规定的位置。请看下面这张图,规定的位置是"20px 10px"和"60px 50px",都是 阅读全文
摘要:
气泡状文本框,是一种很生动的网页设计手段。它可以用来表示用户的发言。也可以用来作为特定信息的提示符。DVD租借网站Netflix,还用它显示碟片的详细信息。=========================制作CSS气泡框的传统方法,需要5张背景图片,分别是: *tl.gif,左上方的圆角。 *tr.gif,右上方的圆角。 *bl.gif,左下方的圆角。 *br.gif,右下方的圆角。 *angle.gif,突出的三角形。现在假定有这样一段代码: <blockquote>床前明月光,疑是地上霜。</blockquote> <p>李白</p>我们希 阅读全文
摘要:
去年我学jQuery的时候,曾经做过一点选择器(selector)的笔记。这几天拿出来看了一下,发现很多都忘记了。所以,我决定把它们贴在这里,方便以后查看。这对其他朋友应该也是有用的,毕竟选择器是制作网页效果的第一步。笔记分为两个部分,今天是CSS的选择器,以后还有一部分xPath的选择器。今天的笔记中包括44个选择器,基本涵盖了CSS 2和CSS 3的所有规定。=====================CSS选择器笔记阮一峰 整理参考网址:456 Berea Street一、基本选择器序号选择器含义1.*通用元素选择器,匹配任何元素2.E标签选择器,匹配所有使用E标签的元素3..infocl 阅读全文
摘要:
随着3G的普及,越来越多的人使用手机上网。移动设备正超过桌面设备,成为访问互联网的最常见终端。于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页?手机的屏幕比较小,宽度通常在600像素以下;PC的屏幕宽度,一般都在1000像素以上(目前主流宽度是1366×768),有的还达到了2000像素。同样的内容,要在大小迥异的屏幕上,都呈现出满意的效果,并不是一件容易的事。很多网站的解决方法,是为不同的设备提供不同的网页,比如专门提供一个mobile版本,或者iPhone / iPad版本。这样做固然保证了效果,但是比较麻烦,同时要维护好几个版本,而且如果一个网站有多 阅读全文
摘要:
CSS3是样式表(style sheet)语言的最新版本,它的一大优点就是支持圆角。网页设计大师Nicholas Zakas的最新文章,清晰易懂地解释了CSS3圆角的各个方面,非常值得学习。以下就是我翻译的中文版。=========================================CSS3圆角详解作者:Nicholas Zakas译者:阮一峰原文:http://msdn.microsoft.com/en-us/scriptjunkie/gg508841.aspx发表日期:2010年12月8日一、CSS3圆角的优点传统的圆角生成方案,必须使用多张图片作为背景图案。CSS3的出现,使 阅读全文
摘要:
下面是一组颜色工具网站,非常有用。理论部分,可以参考我前几天做的颜色理论笔记。1. ColorSchemer Gallery网址:http://www.colorschemer.com/schemes/[说明] 专门收集用户上传的各种配色方案。2. WebSite Color Picker网址:http://www.digitdesigns.com/colrPick/framePic.htm[说明] 为网页的背景、字体、链接选择不同的颜色,实时查看效果。3. ColorJack网址:http://www.colorjack.com/sphere/[说明] 选择一种主色调后,自动生成其他相关的颜 阅读全文