`
zy77612
  • 浏览: 279453 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

CSS-小技巧

CSSIE浏览器FirefoxHTML 
阅读更多

 

介绍CSS属性border-width边框宽度属性的用法

 

border-width属性简介：

border-width边框宽度属性用来设定边框的宽度。边框区域的定义，可参见 CSS 盒子模式 (Box Model) 。 

值：<border-width>{1,4} | inherit  

可用值 值的说明  

medium 缺省值。中等宽度。  

thin 比 medium 细。  

thick 比 medium 粗。  

width 浮点数后跟绝对长度单位 (cm, mm, in, pt, or pc) 或相对长度单位 (em, ex, or px)。  

border-width 是 border-top-width， border-right-width， border-bottom-width，border-left-width 的一种快捷的综合写法，最多允许四个值，依次的顺序是：上，右，下，左。 

如果只有一个值，表示四个边框都用同样的宽度。如果有两个值，第一个值表示上下边框宽度，第二个值表示左右边框宽度。如果有三个值，第一个值表示上边框宽度，第二个值表示左右边框宽度，第三个值表示下边框宽度。 

示例代码 

.d2 {border-width:thin;border-style:solid;} 

.d3 {border-width:thick;border-style:solid;} 

.d4 {border-width:10px;border-style:solid;} 

.d5 {border-width:5mm;border-style:solid;} 

 

CSS属性background-position用法

 

 

语法:

background-position : length || length 

background-position : position || position  

 参数： 

length : 　百分数 | 由浮点数字和单位标识符组成的长度值。请参阅长度单位 

position : 　top | center | bottom | left | center | right 

说明： 

 设置或检索对象的背景图像位置。必须先指定background-image属性。默认值为：(0% 0%)。 

如果只指定了一个值，该值将用于横坐标。纵坐标将默认为50%。第二个值将用于纵坐标。 

该属性定位不受对象的补丁属性(padding)设置影响。 

对应的脚本特性为backgroundPosition。请参阅我编写的其他书目。 

  

示例： 

div { background: url("images/aardvark.gif"); background-position: 35% 80%; }  

menu { background: url("images/aardvark.gif"); background-position: 35% 2.5cm; }  

a { background: url("images/aardvark.gif"); background-position: 3.25in; }  

body { background: url("images/aardvark.gif"); background-position: top right; }

 

CSS属性position用法

 

 

 

语法：

 position : static | absolute | fixed | relative

 参数：

 static : 　无特殊定位，对象遵循HTML定位规则

absolute : 　将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层叠通过z-index属性定义。此时对象不具有边距，但仍有补白和边框

relative : 　对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置

fixed : 　IE5.5及NS6尚不支持此属性

 说明：

 检索对象的定位方式。

对应的脚本特性为position。请参阅我编写的其他书目。

 示例：

 div { position: absolute; bottom: 1in; left: 1in; right: 1in; top: 1in; }

div { position:relative; top:-3px; left:6px; }

 

如何隐藏网页中的层DIV

div的visibility可以控制div的显示和隐藏，但是隐藏后页面显示空白：
　　style="visibility: none;"
　　document.getElementById("typediv1").style.visibility="hidden";//隐藏
　　document.getElementById("typediv1").style.visibility="visible";//显示


　　通过设置display属性可以使div隐藏后释放占用的页面空间，如下

style="display: none;"
　　document.getElementById("typediv1").style.display="none";//隐藏
　　document.getElementById("typediv1").style.display="";//显示

 

 

CSS兼容IE6/IE7/FF的通用方法

 

 

来源:网络 | 2007-7-14 | (有1230人读过)

 

一、CSS HACK 

以下两种方法几乎能解决现今所有HACK. 

1, !important 

随着IE7对!important的支持, !important 方法现在只针对IE6的HACK. 

(注意写法.记得该声明位置需要提前.) 

<style> 

#wrapper 

{ 

width: 100px!important; /* IE7+FF */ 

width: 80px; /* IE6 */ 

} 

</style>2, IE6/IE77对FireFox 

*+html 与 *html 是IE特有的标签, firefox 暂不支持. 

而*+html 又为 IE7特有标签. 

<style> 

#wrapper 

{ 

#wrapper { width: 120px; } /* FireFox */ 

*html #wrapper { width: 80px;} /* ie6 fixed */ 

*+html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */ 

} 

</style> 

注意: 

*+html 对IE7的HACK 必须保证HTML顶部有如下声明, 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"　"http://www.w3.org/TR/html4/loose.dtd">  

二、万能 float 闭合(非常重要!) 

关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup] 

将以下代码加入Global CSS 中,给需要闭合的div加上class="clearfix"  即可,屡试不爽. 

<style> 

/* Clear Fix */ 

.clearfix:after  

{  

content:".";  

display:block;  

height:0;  

clear:both;  

visibility:hidden;  

}  

.clearfix  

{ 

display:inline-block; 

} 

/* Hide from IE Mac \*/  

.clearfix {display:block;}  

/* End hide from IE Mac */  

/* end of clearfix */ 

</style> 

三、其他兼容技巧(再次啰嗦) 

1, FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.(可用!important解决) 

2, 居中问题. 

1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vertical-align: middle.( 注意内容不要换行.) 

2).水平居中. margin: 0 auto;(当然不是万能) 

3, 若需给 a 标签内内容加上 样式, 需要设置 display: block;(常见于导航标签) 

4, FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题. 

5, ul 标签在 FF 下面默认有 list-style 和 padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表) 

6, 作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应. 

7, 关于手形光标. cursor: pointer. 而hand 只适用于 IE. 

P.S 至于IE5以及其他浏览器就没有必要兼顾了. 在这上面花时间不值得.   

 

css中em与px的介绍及换算方法

 

 

来源:jorux | 2007-6-18 | (有3036人读过)

 

em是何物？ 

em指字体高，任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font -size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。

em有如下特点： 

1. em的值并不是固定的； 

2. em会继承父级元素的字体大小。

重写步骤：

1. body选择器中声明Font-size=62.5%；

2. 将你的原来的px数值除以10，然后换上em作为单位；

简单吧，如果只需要以上两步就能解决问题的话，可能就没人用px了。经过以上两步，你会发现你的网站字体大得出乎想象。因为em的值不固定，又会继承父级元素的大小，你可能会在content这个div里把字体大小设为1.2em, 也就是12px。然后你又把选择器p的字体大小也设为1.2em，但如果p属于content的子级的话，p的字体大小就不是12px，而是1.2em= 1.2 * 12px=14.4px。这是因为content的字体大小被设为1.2em，这个em值继承其父级元素body的大小，也就是16px * 62.5% * 1.2=12px, 而p作为其子级，em则继承content的字体高，也就是12px。所以p的1.2em就不再是12px，而是14.4px。

3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明，也就是避免以上提到的1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em，那么在声明p的字体大小时就只能是1em，而不是1.2em, 因为此em非彼em，它因继承#content的字体高而变为了1em=12px。

CSS属性：background(背景属性)

背景颜色属性(background-color) 
这个属性为HTML元素设定背景颜色，相当于HTML中bgcolor属性。 

body {background-color:#99FF00;} 
上面的代码表示Body这个HTML元素的背景颜色是翠绿色的。 


背景图片属性(background-image) 
这个属性为HTML元素设定背景图片，相当于HTML中background属性。 

<body style="background-image:url(../images/css_tutorials/background.jpg)"> 
上面的代码为Body这个HTML元素设定了一个背景图片。 


背景重复属性(background-repeat) 
这个属性和background-image属性连在一起使用，决定背景图片是否重复。如果只设置background-image属性，没设置background-repeat属性，在缺省状态下，图片既横向重复，又竖向重复。 

repeat-x 背景图片横向重复   
repeat-y 背景图片竖向重复   
no-repeat 背景图片不重复   
body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:repeat-y} 
上面的代码表示图片竖向重复。 


背景附着属性(background-attachment) 
这个属性和background-image属性连在一起使用，决定图片是跟随内容滚动，还是固定不动。这个属性有两个值，一个是scroll，一个是fixed。缺省值是scroll。 

body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:no-repeat; background-attachment:fixed} 
上面的代码表示图片固定不动，不随内容滚动而动。

CSS实用小技巧14则

[摘 要] 

用好CSS能使你的网页更加简炼，为什么同样内容的网页，有的人做出来有几十KB，而高手做出来只有十几KB，CSS在其中的作用是不言而喻的。我把我在使用CSS中的一些小经验以及一些网友来信提问的问题整理出来，供诸位参考。  

CSS是Cascading Style Sheets的简称，中文译作“层叠样式表单”，我把它叫作“层叠样式表”，我感到这样顺口一 
点，没别的意思。实际上它是一组样式。你可能对CSS这个名词比较陌生，实际上无论你用Internet Explorer还是 
Netscape Navigator在网上冲浪，几乎随时都在与CSS打交道，在网上没有使用过CSS的网页可能不好找。不管你用什么工 
具软件制作网页，都有在有意无意地使用CSS。 

1、CSS在网页制作中一般有三种方式的用法，那么具体在使用时该采用哪种用法？ 
　　 当有多个网页要用到的CSS，采用外连CSS文件的方式，这样网页的代码大大减少，修改起来非常方便；只在单个网页 
中使用的CSS，采用文档头部方式；只有在一个网页一、两个地方才用到的CSS，采用行内插入方式。 

2、CSS的三种用法在一个网页中要以混用吗？ 
　　 三种用法可以混用，且不会造成混乱。这就是它为什么称之为“层叠样式表”的原因，浏览器在显示网页时是这样处 
理的：先检查有没有行内插入式CSS，有就执行了，针对本句的其它CSS就不去管它了；其次检查头部方式的CSS，有就执行 
了；在前两者都没有的情况下再检查外连文件方式的CSS。因此可看出，三种CSS的执行优先级是：行内插入式、头部方 
式、外连文件方式。 

3、在Dreamweaver3中如何使外部文件式CSS？ 
　　 在Dreamweaver3中使用外连文件式CSS并没有特殊要求，同样是用记事本创建一个*.css文件，在网页的<head>与 
</head>之间加上一句这样的代码：<link rel="stylesheet" href="在这里填上你的CSS文件地址（相对路径+文件 
名）" type="text/css"> 就行了。 

4、如何用Dreamweaver3快速创建CSS外连式文件？ 
　　 对于一个初接触CSS的网页设计人员来讲，要用记事之类的编辑器，去创建一个CSS外连式文件是相当困难的。由于 
Dreamweaver3对CSS支持的很好，用它来帮助就轻松多了。具体可以这样操作： 
　　 1）先在纸上写好在网站的网页中可能要用到的格名称，然后在Dreamweaver3的编辑窗中调出CSS面板，一个一个地定 
义，并在一个空白页上适当地写一点相关内容，边定义边试用，效果不满意，立即修改； 
　　 2）全部定义好后，再用记事本创建一个空的CSS外连式文件，把在<head>与</head>之间的那段定义好的CSS复制 
到CSS文件中去，就大功告成了。整个过程就是点鼠标，方便吧？ 

5、在Dreamweaver3中采用行内插入式CSS要手动写代码吗？  
　　 不用！先用CSS面板定义好要用的CSS，然后，在要插入CSS的标记插入：style=""，再把你刚才定义的CSS从<head> 
后面拖到这个双引号中来，把花括号以外的部分删去就行了。 

6、在方档头部方式和外连文件方式的CSS中都有“<!--”和“-->”，好象没什么用，不要可以吗？ 
　　 这一对东东的作用是为了不引起低版本浏览器的错误。如果某个执行此页面的浏览器不支持CSS，它将忽略其中的内 
容。虽然现在使用不支持CSS浏览器的人已很少了，由于互联网上几乎什么可能都会发生，所以还是留着为妙。 

7、如何给一部分文字加背景色？ 
　　 给文字加上不同颜色，在DW3中只要在属性面板上选取文字的颜色就行了，非常方便，但要给部分文字加不同的背景色 
却没有相应的功能，我们可以先做一个定义背景色的CSS（如：bgstyle），在DW3中点几下鼠就完成了。如一个定义淡黄色 
背景的CSS是这样的： 
<style type="text/css"> 
<!-- 
.bgstyle { background: #FFFFCC} 
--> 
</style> 
　　 在要用时选取那段文字，再在CSS面板上点一下“bgstyle”就行了。 

8、如何给部分文字加背景图像？ 
　　 与加背景色操作类似，中是在背景在选择加载图象就是了，一个定义好的加背景图象的CSS例子的代码是这样的： 
<style type="text/css"> 
<!-- 
.imgbgstyle { background-image: url(logo.gif)} 
--> 
</style> 
　　 在要用时选取那段文字，再在CSS面板上点一下“imgbgstyle”就行了。  

9、如何使页面的背景在文字“滚动”时背景图案静止不动？ 
　　 要使背景图案不随文字“滚动”的CSS是这样的： 
<style type="text/css"> 
<!-- 
BODY { background: purple url(bg.jpg); 
　　　 background-repeat:repeat-y; 
　　　 background-attachment:fixed 　 
　　　　 } 
--> 
</style>  

10、如何定义字间距？ 
　　 在DW3中CSS的属性定义对话框（Style Definition for .style1)的“Block”上的“letter spaceing”属性定义的就 
是字间距，它指的是每一个字符之间的额外间距，经长度为单位，正负值均可，当取负值时产生字符挤在一起的效果。下 
面代码是一个定义好的字间距CSS例子： 
<style type="text/css"> 
<!-- 
.style1 { letter-spacing: 3px} 
--> 
</style>  

11、如何给文字加上划线、下划线、删除线和闪烁？ 
　　 在DW3中CSS的属性定义对话框(Style Definition for .style1)的“Type”上的“decoration”属性定义的就是这些 
内容，要注意的是闪烁属性有些版本的浏览器不支持，少用为好。下面是一个定义好上述效果的CSS例子： 
<style type="text/css"> 
<!-- 
.style1 { text-decoration: underline overline line-through blink} 
--> 
</style>  
　　 其中： “underline”是定义下划线；“overline ”是定义上划线；“ line-through”定义的是删除线；“blink” 
定义的是文字闪烁。 

12、如何使网页具有“首行缩进”功能？ 
　　 由于DW3输入空格不方便，利用“首行缩进”将弥补这个不足。在DW3中CSS的属性定义对话框（Style Definition  
for .style1)的“Block”上的“text-indent”属性定义的就是“首行缩进”，所谓“首行”是指每段内容的第一行，也 
就是直接按回车键就形成了一个新的段落。缩进最好以“em”（字符）为单位，比如：汉字编排要求每段开始缩进两个汉 
字，设置好的CSS如下所示： 
<style type="text/css"> 
<!-- 
.style1 { text-indent: 2em} 
--> 
</style>  
　　 在DW3要注意：在DW3中CSS的属性定义对话框（Style Definition for .style1)的“Block”上的“text-indent”右 
面的缩进单位选择框中“ems”指的就是“em”。 

13、在用表格进行排版时，能使某一方向上的内容离开表格线一点吗？ 
　　 可以！在DW3中CSS的属性定义对话框（Style Definition for .style1)的“Box”上的“margin”定义的就是内容离 
开边缘的距离，分别可定义四个方向：“top”“bottom”“left”“right”。下面就是定义在左边离开“10px”的CSS例 
子代码：  
<style type="text/css"> 
<!-- 
.style1 { margin: 0px 0px 0px 10px} 
--> 
</style> 

14、能给某部分内容加边框吗？ 
　　 用CSS可以给某部分内容加边框，在DW3中CSS的属性定义对话框（Style Definition for .style1)的“Border”定义 
的就是边框线，“top”“bottom”“left”“right”四边可分别定义线的粗细和颜色，这些定义好后不要忘记在下面的 
“Style”中定义线型，否则将看不边框线，因为默认的线型是“none”。下面是一个定义了上边框为：蓝色细线；左边框 
为：绿色中粗线的CSS例子： 
<style type="text/css"> 
<!-- 
.style1 { border: solid; border-width: thin 0px 0px medium; border-color: #0000FF black black #00FF00} 
--> 
</style> 
 

 

背景位置属性(background-position) 
这个属性和background-image属性连在一起使用，决定了背景图片的最初位置。 

body {background-image:url(../images/css_tutorials/background.jpg);background-repeat:no-repeat; background-position:20px 60px} 
上面的代码表示背景图片的初始位置距离网页最左面20px，距离网页最上面60px。 

 

背景属性(background) 
这个属性是设置背景相关属性的一种快捷的综合写法， 包括background-color, background-image, background-repeat, backgroundattachment, background-position。 

body {background:#99FF00 url(../images/css_tutorials/background.jpg) no-repeat fixed 40px 100px} 
上面的代码表示，网页的背景颜色是翠绿色，背景图片是background.jpg图片，背景图片不重复显示，背景图片不随内容滚动而动，背景图片距离网页最左面40px，距离网页最上面100px。 

 

css中link和@import区别

 

 

 

css在页面里面一般有三种引入方式 

1.在页面里面直接写 

   <style type="text/css"> 

   body{ 

      margin: 0; 

     padding: 0; 

   } 

   </style> 

  

2.用link进行引用 

<link rel="stylesheet" type="text/css" href="my.css"> 

3.用import进行引用 

<style type="text/css"> 

   @import url(my.css); 

</style> 

第一种是直接在html页面上进行css书写，而第二种和第三种是采用外部引用样式单独提取文件。 

问题1.到底link和@import有什么区别？ 

我们先来看看他们的定义 

Quote  

link元素 

HTML和XHTML都有一个结构，它使网页作者可以增加于HTML文档相关的额外信息。这些额外资源可以是样式化信息（CSS）、导航助手、属于另 外形式的信息（RSS）、联系信息等等。 

Quote  

@import 

指定导入的外部样式表及目标设备类型。 

其实link和@import的最根本区别就是，link是一个html的一个标签，而@import是css的一个标签, 

link除了调用css外还可以有其他作用譬如声明页面链接属性，声明目录，rss等等，而@import就只能 

调用css。如果单独从外部引用css来说，他们的作用是基本一样，只不过上面的老大不一样而已。：） 

问题2.link合import到底那个更好？ 

上面说了因为上面的老大不一样，所以在使用上就会有一些细节的区别，不能说总体谁好谁坏， 

只能说具体情况具体分析。 

1）我要用javascript进行样式选择； 

这个时候就要用link,因为link是html元素，可用javascript去控制dom元素最后达到改变样式的效果。 

看下列代码 

<link rel="stylesheet" href="/css/styles.css" type="text/css" media="screen" /> 

<link rel="stylesheet" href="/css/orange.css" type="text/css" media="screen" title="orange" /> 

<link rel="alternate stylesheet" href="/css/blue.css" type="text/css" media="screen" title="blue" /> 

<link rel="alternate stylesheet" href="/css/pink.css" type="text/css" media="screen" title="pink" /> 

<link rel="alternate stylesheet" href="/css/slate.css" type="text/css" media="screen" title="slate" /> 

这是一段很经典的改变页面风格的代码，因为我们今天主要讲的是link和import，所以我这里只列出了引用css部分。 

我们先来看看link里面个个属性都是表达了什么意思： 

[1]rel:用来声明链接对象的作用或者类型。 

譬如上面的的代码："stylesheet"表示链接一个默认的css,而"alternate stylesheet"折表示备选的css 

[2]href:这个就不用我说了吧，引用css的文件路径。 

[3]tyle:文件类型 

[4]media:应用的设备，"screen"是说明应用在屏幕上。 

[5]title:是css的名称。 

这段代码中一共有5个css,第一个是基本样式，而其他四个是风格样式,利用javascript去控制默认显示的样式title就ok了。 

2）我要在应用打印样式； 

打印样式顾名思义就是打印页面时候的样式。 

这个样式在普通浏览下是没有效果的，只有在打印的时候生效。 

如果要为页面单独引用打印样式的话，link和@import都可以的。 

link代码 

<link rel="stylesheet" href="/css/styles.css" type="text/css" media="print" /> 

@import代码 

<style type="text/css"> 

@import url(foo.css) print; 

</style> 

另外对于css来说还有一种方式@media： 

@media print {  

@import "print.css"  

}  

用@media先制定设备为 print,然后再用@impor链接 

3）我要引用多个样式； 

如果要在一个页面上引用多个样式组合产生效果的话，永link和@import也是都可以的。 

link代码 

<link rel="stylesheet" href="/css/styles.css" type="text/css" media="screen" /> 

<link rel="stylesheet" href="/css/orange.css" type="text/css" media="screen" /> 

@import代码 

<style type="text/css"> 

   @import url(../css/base/my.layout.css); 

   @import url(../css/base/my.typo.css); 

   </style> 

不过个人觉得，用@import引用多文件的时候更加清晰一些 

另外对于多样式还有一种link于@import的组合用法。 

先用link引用一个css文件 

<link rel="stylesheet" href="/css/styles.css" type="text/css" media="screen" /> 

然后在这个css文件里面再引用。 

<style type="text/css"> 

   @import url(../css/base/my.layout.css); 

   @import url(../css/base/my.typo.css); 

   </style> 

这样做的好处是，如果你一个站点所有页面引用的样式都是一样的， 

而有又多个css，如果你每个页面都加4,5个一样的css样式，却是浪费代码和精力， 

所以莫不如这样做，所有一个页面都引用一个css，然后一个css在引用多个css，方便。

分享到：
| 调试诊治CSS布局的10个有效方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    css-adv:htmlcss 布局实现技巧练习

    css-adv 前端能力提升练习html/css布局实现技巧练习css 练习布局命名由css-前缀开头图片hover，1px公用边不对称的全宽背景平铺两列的经典布局（实现其中一列自适应？再优先加载？两列等高？）简单的tab切换，要压住...

    js添加css样式小技巧

    一个使用js来添加css样式的小技巧，让您轻松掌握通过js来添加css的技术

    css-demo:实现各种效果的小技巧

    css-demo 实现各种效果的小技巧 运行地址：

    CSS样式表常用小技巧

    CSS样式表常用小技巧

    css样式表小技巧的总结

    css样式表小技巧总结，让您轻松应对css样式设计问题

    制作网页中Html+css小技巧收集

    制作网页中Html+css小技巧，一些网页制作的心的

    十四个CSS应用小技巧陈列

    主要介绍如何CSS能使你的网页更加简炼以及使用CSS中的一些小经验.

    web 笔记，包含JavaScript、CSS、HTML 等；各种前端开发的小技巧及总结.zip

    各种前端开发的小技巧及总结. web 笔记，记录自己学习前端的历程，记录自己学习的代码，包含JavaScript、CSS、HTML 等；各种前端开发的小技巧及总结. web 笔记，记录自己学习前端的历程，记录自己学习的代码，包含...

    css小技巧汇总

    本文主要对css小技巧进行简单汇总。具有很好的参考价值，需要的朋友一起来看下吧

    css实用的技巧 css css

    在一些论坛里找到的一些小技巧，希望对大家有用哦…………………………………………

    纯css实现更改图片颜色的技巧

    css更改图片颜色的技巧 ，代码很简单...以上所述是小编给大家介绍的纯css实现更改图片颜色的技巧 ,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支

    css布局小技巧分享(必看)

    下面小编就为大家带来一篇css布局小技巧分享(必看)。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

    CSS技巧，提升CSS技能

    收集的一些CSS小技巧，希望能帮助到你，如果你感觉有用，也请你收藏与分享给你的小伙伴们。

    css-tricks:自定义html元素的小项目

    CSS技巧 自定义html元素的小项目

    CSS文集

    利用CSS的Expression自定义属性来实现表格的OnMouseOver 特效 需要掌握的八个CSS布局技巧 用css实现链接经过时显示浮动图片背景的效果 自适应大小的CSS圆角盒子 div+css实现Firefox和IE6兼容的垂直居中...

    CSS网页布局开发小技巧24则

    24条小技巧，希望对你有帮助.。。。。。

    css导航栏设计技巧

    一例很经典的CSS技术，值得研究。css下拉变换字体和颜色的一个小技术，试试吧。

    css 4.2.7中文手册（CHM版）

    css 4.2.7中文手册给大家列举了一些CSS中的相关知识。比如：属性，选择符，语法与规则，取值与...另外，给大家总结了一些使用过程中，遇到的问题和解决办法，并且提供了一些简单的小技巧和经验，希望能为大家带来帮助。

    《CSS设计彻底研究》【中文PDF＋源代码】

    好多资源不全，所以再次上传 《CSS设计彻底研究》是一本深入研究和揭示CSS设计技术的书籍。《CSS设计彻底研究》在透彻地讲解CSS核心技术的基础上，深入到各个实际应用领域中，充分向读者演示了...附录　CSS英文小字典

    div+css知识2

    div+cssCSS网页布局开发小技巧24则

Magicbox
Global site tag (gtag.js) - Google Analytics