以图明志

CSS

IE的CSS渲染跟其它浏览器有什么不同

浏览器兼容需要对IE的工作模式有所了解
由于IE系浏览器对标准的支持不够好,导致Web开发中经常需要去处理浏览器兼容性问题,特别有些莫名其妙的问题很让人头疼。如果外部样式、内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况。之所以说是一般情况是因为可以使用!important来改变这种顺序,比如外部样式如果某个样式项使用了!important来提高优先级,其优先级将比内联样式高。

CSS

CSS设计一个三列布局的页面

两列定宽中间自适应的结构布局
探讨这种布局是因为最近对话框组件以及信息系统B/S界面布局的需要。无论是什么,我们在写CSS之前首先引入reset.css,我使用的是淘宝的reset。将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。我们知道在IE6.0以及IE7.0是使用了一个has layout的概念。

CSS

CSS的历史与工作原理

与CSS经验分享
网页浏览器主要通过HTTP协议连接网页服务器而取得网页,HTTP容许网页浏览器送交资料到网页服务器并且获取网页。目前最常用的 HTTP 是 HTTP/1.1,这个协议在RFC2616中被完整定义。HTTP/1.1 有其一套Internet Explorer并不完全支援的标准,然而许多其他当代的网页浏览器则完全支援这些标准。网页的位置以URL(统一资源定位符)指示,此乃网页的地址;以http:开首的便是通过 HTTP协议登陆。

CSS

弄清楚CSS的匹配原理

让你写出高效的CSS
用了这么多年的CSS,现在才明白CSS的真正匹配原理。看1个简单的CSS:DIV#divBox p span.red{color:red;}按习惯我们对这个CSS 的理解是,浏览器先查找id为divBox的DIV元素,当找到后,再找其下的所有p元素,然后再查找所有span元素,当发现有span的class为red的时候,就应用该style。多么简单易懂的原理,可是这个理解却是完完全全相反、错误的。

CSS

CSS的overflow属性介绍

如何处理不符合元素框的内容
overflow 属性规定如何处理不符合元素框的内容。 参数介绍: visible:内容不会被修剪,会呈现在元素框之外。 hidden:内容会被修剪,但是浏览器不会显示供查看内容的滚动条。 scroll:内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。 auto:由浏览器决定如何显示。如果需要,则显示滚动条。

CSS

纯CSS2实现的边框三角形

一个很好的CSS三角技巧
利用CSS的border属性可以生成一些图形,例如三角或是圆角。纯粹的CSS2的内容,没有兼容性的问题。css border 三角,纯css2实现,兼容各浏览器(包括IE6),且效果非常好。

CSS

如何控制图片的最大宽度

使用CSS表达式
网站开发时经常遇到的问题,有些图片不适宜过大,大了之后会把整个网页撑开,很不好看。下面是CSS控制图片显示的最大宽度的代码,直接放在CSS文件中调用就可以了。IE5及其以后版本支持在CSS中使用expression,用来把CSS属性和JavaScript表达式关联起来,这里的CSS属性可以是元素固有的属性,也可以是自定义属性。

CSS

CSS让超出的文字显示为省略号

用省略号代替文字的超出部分是很常见的需求
对大片文字的显示样式进行限制是CSS中最常用的地方之一,我们在行列时,经常会出现一行文字超出了宽度,很多人使用了 overflow:hidden,让超出来的内容隐藏,有没有一种代码让文字超出时,出现省略号了?

CSS

YUI的CSS Reset方法

教你如何重置样式
CSS Reset 即重设浏览器的样式。在各种浏览器中,都会对CSS的选择器默认一些数值,譬如当h1没有被设置数值时,显示一定大小。但并不是所有的浏览器都使用一样的数值,所以,有了CSS Reset,以让网页的样式在各浏览器中表现一致。

CSS

CSS实现垂直居中的一个技巧

又一个实用的居中技巧
水平居中我们知道最简便的方法就是margin:auto,但是margin只是相对宽度有效。如果垂直居中的元素高度已知,这个比较简单,也不需要额外的辅助元素。如果居中元素高度可变,这个需要额外的一个wrapper元素,用table-cell的方式来模拟表格的居中实现,当然,早期的ie又是另一招,具体可见代码。

CSS

CSS的inline-block属性分析

解决浮动的蹊跷问题
ie6,ie7的haslayout属性是个让人头疼的问题。在做导航条的时候,一般会用到ul li结构,大多数时候我们是把li设置为浮动,让其并排显示在同一行。还有一种方法就是设置li为display:inline;这样可以达到同样的效果,但是问题是inline元素的特性:默认无法设置宽度,高度,以及上下margin。

CSS

CSS各种鼠标样式介绍

让你自定义你的鼠标样子
大家否曾注意到有些网站的鼠标不是规则的斜向上箭头的形状,而是十字形,或者是向左的箭头,或者是个问号等等。当你想在网页的不同位置让鼠标显示不 同形状,以体现不同的功能区;当你想让你的网站体现与众不同的风格时,考虑一下在鼠标样式上下功夫吧。其实鼠标样式的用途还是极为广泛的,那么怎样才能实现鼠标的不同样式呢?

JavaScript

判断浏览器类型并使用相应的CSS

让你的网站呈现更灵活
做过前端开发的应该都会对浏览器兼容问题抓过头吧,这里有一种方法,可以根据用户使用的浏览器判断使用何种CSS,同样,你也可以根据用户登录的时间,显示白天,夜晚或者凌晨,这样可以使你的网站更加人性化。

CSS

高效的CSS代码编写规范

如何实现高效整洁的CSS代码
CSS学起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在CSS书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的CSS代码原则。不同浏览器元素的默认属性有所不同,使用Reset可重置浏览器元素的一些默认属性,以达到浏览器的兼容。但需要注意的是,请不要使用全局Reset。

CSS

CSS的基本结构和作用

非常好的一个CSS基础教程
有一次找工作面试,很直接的那个面试官就问了我“CSS的作用是什么?”我当时回答也很搞笑,就说了句,“现在做网站离不开CSS,这个就像鱼离不开水一样”。可能觉得说得也没错。但深层次的想,确实没有回答人家的问题。

CSS

CSS强大的选择器利器

全面介绍CSS的选择器
一般没有系统的学习过,只是在网上看一些片断教程的人。见到最多的可能也就是:元素选择符(例如:body 、a 、li )ID选择符(例如:#head、#body、#foot)类选择符(例如:.red、.item、.content)今天我们把所有的选择符统统拿出来说个遍。
2 / 3 首页 < Prev 1 2 3 Next > 尾页 页码: