xue_kanglu的博客_css

clearfix清除浮动进化史

我想大家在写CSS的时候应该都对清除浮动的用法深有体会，今天我们就还讨论下clearfix的进化史吧。首先在很多很多年以前我们常用的清除浮动是这样的。.clear{clear:both;line-height:0;}现在可能还可以在很多老的站点上可以看到这样的代码，相当暴力有效的解决浮动的问题。但是这个用法有一个致命伤，就是每次清除浮动的时候都需要增加一个空标签来使用。<p class="c

clearfix 前端

转载精选 2014-09-11 15:52:04 805 阅读

border radius

radius，就是半径的意思。用这个属性可以很容易做出圆角效果等价于border-top-left-radius:2em; border-top-right-radius:2em; border-bottom-right-radius:2em; border-bottom-left-radius:2em; 相关属性 border-top-right-radius border-bottom-rig

border radius

原创 2014-01-06 18:31:40 606 阅读

css的兼容问题汇总

1 为什么无法定义1px左右高度的容器IE6下这个问题是因为默认的行高造成的。解决的方法也有很多，例如:overflow:hidden | zoom:0.08 | line-height:1px 。2 IE6下为什么图片下有空隙产生解决这个BUG的方法也有很多，可以是改变html的排版，或者设置img 为display:block 或者设置vertical-align 属性为 vertical-a

web

css兼容

原创 2013-12-10 17:10:48 514 阅读

div半透明图片ie6下透明

1 切图2 div{filter:Alpha(Opacity=50);/* IE */-moz-opacity:0.5;/* Moz FF */opacity: 0.5;} 1 图片也可以用gif 2 注：DD_belatedPNG.js 和 js会产生冲突所以比如一个tab切换做了效果又做了背景图片透明一般这个背景要用gif的<scr

web

半透明

图片ie6下透明

转载精选 2013-12-10 16:40:48 451 阅读

web标准中定义id与class有什么区别吗

一、属性的优先级问题 id 的优先级要高于class，看上面的例子三.方便JS等客户端脚本，如果在页面中要对某个对象进行脚本操作，那么可以给他定义一个id，否则只能利用遍历页面元素加上指定特定属性来找到它，这是相对浪费时间资源，远远不如一个id来得简单。二、同一个的class选择符可以在一个文档中重复出现，而id选择符却只能出现一次。对一个标签同时使用class和id进行CSS定义，如果定义有重复

客户端

元素

优先级

id和clas

sweb标准

原创 2013-12-10 16:26:57 680 阅读

div居中的方法

水平居中如果是块元素：div { position:absolute; top:50%; left:50%; margin:-100px 0 0 -100px; width:200px; height:200px; border:1px solid red; } div｛width:300px; margin:0 auto;｝如果是内联元素：text-align:center;垂直居中如果是块元

div

居中方法

原创 2013-12-10 16:20:25 390 阅读

css中一些标签的简写

1 padding{0px 0px 0px 0px} 上右下做 margin同此2 background{#f00 url(img.jpg) 20px 13px no-repeat;}注：如果在一个大的白色容器里有一个按钮是白色字体他的背景是个图片那么务必要给这个按钮再加一个深颜色的背景以防页面缓冲导致文字出不来影响用户体验；3 fon

web

css

一些标签的简写

原创 2013-12-10 16:02:02 376 阅读

CSS调用外部字体

语法： @font-face{font-family:name;src:url(url);sRules} 取值： name：字体名称。任何可能的 font-family 属性的值 url(url)：使用绝对或相对 url 地址指定OpenType字体文件 sRules：样式表定义第一步获取要使用字体的三种文件格式，确保能在主流浏览器中都能正常显示该字体。.TTF或.OTF，适用于Firefox

css3

字体转换

@font-face

icofont

转载精选 2013-12-10 15:55:09 1516 阅读

A链接的4种状态

Link Visited Hover Active定义A标签要注意的小问题：当我们定义a{color:red;}时，它代表了A的四种状态的样式，如果此时要定义一个鼠标放上的状态只要定义a:hover就可以了，其它三种状态就是A中所定义的样式。只定义了一个a:link时，一定要记得把其它三种状态定义出来！a{ text-decoration:none;noFocusLine:expression(t

html

web

a链接的4种状态

原创 2013-12-10 15:41:08 893 阅读

css编写要注意什么及一些公用的样式和外部引用转码

http://tool.chinaz.com/Tools/CssFormat.aspx?qq-pf-to=pcqq.grouphttp://zh.learnlayout.com/display.html(从0开始学习css)（css,js的转码工具)css在firefox，opear，ie7，ie8都可以使用，在ie6中不能使用。为什么？？原因主要有两个:一：是编码不一样。因为如果你的css和网页

网页

注释

怎样让页面更规范

公用样式转码

置顶原创 2013-12-10 15:31:20 564 阅读

常见的浏览器Hack技巧总结

如果你经常需要做前端页面，那么你一定多多少少需要解决页面的浏览器兼容问题。而浏览器兼容问题大部分也集中在对IE系列的兼容。这里就总结一下对IE系列的CSS Hack，记录一下，方便以后查阅。 IE Hack http://www.nowamagic.net/librarys/veda/detail/2182

浏览器

Firefox

Chrome

Hack

转载精选 2013-12-10 15:21:29 685 阅读 1点赞

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

糖糖阁

clearfix清除浮动进化史

border radius

css的兼容问题汇总

div半透明图片ie6下透明

web标准中定义id与class有什么区别吗

div居中的方法

css中一些标签的简写

CSS调用外部字体

A链接的4种状态

css编写要注意什么及一些公用的样式和外部引用转码

常见的浏览器Hack技巧总结