以图明志

CSS

CSS的overflow属性介绍

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

CSS

解决频繁清除浮动的一个思路

清除浮动的一个小技巧
浏览器FireFox,Chrome下,li之间有缝隙,Google得知缝隙由字体大小产生,所以另外加入hack来除缝。而这两种实现方法中,float:left要比display:inline;的表现方式要好。因为内联(display:inline;)属于行布局,其特性是在一行里进行布局,所以不能被设定宽高。块级元素的布局相对于内联样式要精确的多。所以尽量使用float:left;

CSS

纯CSS2实现的边框三角形

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

CSS

span float:right后右对齐换行问题

需要对浮动进一步了解
当非float的元素和float的元素在一起的时候,如果非float元素在先,那么float的元素将被排斥也就是说,你的span是float:right,但是你文本还是float:none。如果要让两者在同一行的话,有两种方法。把span先于文本显示,或者或者把文本也设成float。

CSS

如何控制图片的最大宽度

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

CSS

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

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

CSS

CSS中a标签样式的“爱恨”原则

a链接样式的介绍
CSS为一些特殊效果准备了特定的工具,我们称之为“伪类”。其中有几项是我们经常用到的,下面我们就详细介绍一下经常用于定义链接样式的四个伪类。因为我们要定义链接样式,所以其中必不可少的就是超级链接中的锚标签--a,锚标签和伪类链接起来书写的方法就是定义链接样式的基础方法。

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各种鼠标样式介绍

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

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)今天我们把所有的选择符统统拿出来说个遍。

CSS

你必须知道的一些CSS经典技巧

你知道多少个呢?
CSS字体属性简写规则,如何同时使用两个类,关于CSS border的缺省值,图片替换技巧,CSS box模型的另一种调整技巧,块元素居中对齐,用CSS来处理垂直对齐,直通到屏幕底部的背景色等等。只有一点要提醒的:这种简写方法只有在同时指定font-size和font-family属性时才起作用。

CSS

一些CSS的常见缩写方法

灵活使用它们可以让你的CSS文件体积更小
background 简写属性在一个声明中设置所有的背景属性,border 简写属性在一个声明设置所有的边框属性,font 简写属性在一个声明中设置所有字体属性,list-style 简写属性在一个声明中设置所有的列表属性。灵活使用它们可以让你的CSS文件体积更小。
3 / 4 首页 < Prev 1 2 3 4 Next > 尾页 页码: