归档 前端设计

设计是门学问

CSS3 Pie让IE6-8支持圆角、渐变、阴影

CSS3的新特性诸如div圆角、渐变、阴影的特性着实让网页设计轻松不少。不过这些新特性仅仅在IE9和其他非IE核心浏览器中获得支持。

CSS3快速入门

CSS3离我们越来越近了。尽管,很多人指出CSS3这样那样的缺陷,如标准还没有最后完善、浏览器的支持也不够全面。但是,有哪次变革毋须阵痛呢?技术的革新是大势所趋,早点熟悉它绝对没有坏处^_^ 本文中,笔者带各位熟悉一下CSS3的一些新特性;并给出目前主流浏览器对它的支持情况。算是CSS3的快速入门了。

制作面向复杂终端设备的html模板

如今的网络已经不在是PC(个人电脑)一家的天下了。对于一个站点来说,面向不同的终端设备平台(手机、平板电脑等)设计独立的html模板也是大势所趋。 但是,说起来容易,做起来却不是那么简单。个人站长们需要花费更多的精力和时间在应对不同浏览终端设备的切换中。 有没有能够自适应的html模板呢?答案是肯定的。本文中,笔者为各位简单叙述一款能够在桌面浏览器和手机间自由切换的html模板。

纯CSS下拉菜单制作分析

最近一直在复习CSS样式表的知识。笔者这次拿CSS下拉菜单作为练手作品,目的不在其结果;而是进一步解剖、分析CSS样式表的应用场合以及各种属性搭配使用的效果。

CSS样式表继承详解

最近在恶补css样式表的基础知识。上次研究了css样式表之冲突问题详解 。这次是对css样式表继承特性的学习。 什么是继承? 要想了解css样式表的继承,我们先从文档树(HTML DOM)开始。文档树由HTML元素组成。

css样式表之冲突问题详解

CSS样式表的问题是老生常谈了。笔者早在10年前就粗略地接触过一些,那个时候还在上大学^_^。不过,随着时间的推移,好多东西都忘的一干二净。偏偏又自认为已经学过。唉,笔者编写Web UI之时,便总在这些地方犯错误。 下面回顾一下css样式表的冲突问题,基础知识,css高手见笑了。 冲突的来源:  css层叠样式表对同一个标签具有多种定义方法,而每种方法的影响范围(顺序、具体性)却有权重之分。 举个例子,现在有一个网页,有若干个段落: <html> <body> <p>我是一个段落,用来演示css样式表冲突问题。</p> <p>我是第二个段落,用来演示css样式表冲突问题。</p> </body> </html> 当我们为它定义css样式表时候可以有多种方法: 1、定义html标签P 2、定义类class 3、定义ID 4、直接使用内联属性 style=“” 案例分析: <html> <head> <style> body span p {color:pink;} p {background-color:yellow; color:red;} p {color:blue;} //上面的css样式表,人为制造了color的冲突,很明显,更靠近段落的color:blue起了作用 //而第三个段落的css定义确又遵循了具体性的原则,即它在p前指定了须在span内的p, 因此,css不管该样式距离段落的远近。 </style> </head> <body> <p>我是一个段落,用来演示css样式表冲突问题。</p> <p>我是第二个段落,用来演示css样式表冲突问题。</p> <span><p>我是第三个段落,用来演示css样式表冲突问题。</p></span> </body> </html> 总结下来,根据顺序、具体性原则。当一个HTML元素被多个样式选择器定义并产生冲突的时候,其权重(优先级)排序如下: id>class>Multi HTML Tag>Single HTML Tag 另外需要注意的一点是:内联样式(style=“”)的优先级别最高,但现在一般不直接定义某个元素的内联样式。各位读者心中有数就可以了。

[翻译]如何建立iphone专用网站-iphone css 设计提示

iphone4上市后,虽然广受诟病,但不得不承认老乔的苹果确实卖的很好,手机平台的网络应用也备受关注。作为一个独立博客网站,是不是也应该让自己的博客支持手机浏览呢?答案是肯定的! iphone上的Safari浏览器使用的是webkit核心,我们可以基于此建立许多基于css3的酷玩意儿;下面的文章介绍了一些关于iphone客户端website&css设计的基本内容,作为新手入门还是不错的。

W3C School AJAX教程

AJAX简介 (编者按:本文基于W3C School的AJAX指南英文版本,作者进行了简单的重编,不妥之处请指正) AJAX 全称 Asynchronous JavaScript And XML(异步Java脚本与XML)。个人认为最后的XML可以换成任何一种web客户或服务端应用程序,例如,HTML、PHP等。 利用AJAX技术创建的Web应用程序更加高效,同时你不用担心又要学习一种新语言了,因为AJAX只是建立在目前已经成熟的技术之上的高级应用罢了,利用Java脚本和HTTP request就能玩转AJAX。 几乎所有的Web程序员都希望自己写的程序更加高效,在不增加任何学习负担的前提下提高自己程序的效率,何乐而不为呢?一起来学习吧。