w3cTrain

Keep Moving

元素居中是css中人们经常抱怨的一个问题,为什么它如此困难?个人认为原因不是他难,而是不同情况有不同的实现方法,我们很难知道具体用哪种。所以,让我们做一个选择树希望能让他变简单一点。

我需要居中….

1.水平居中

1.1 它是内联元素(inline block,例如文本或链接)

你可以直接让它在块级父元素内居中,例如

1
2
3
.center-children {
text-aligin: center;
}
Read More...

大家来找茬相信很多程序员都玩过,不是因为自己喜欢玩,而是身边的妹纸只会玩这个游戏…
那么前端er如何正确运用所学在妹纸面前装13呢?教大家一个方法。

请在30秒内找出下面两幅图的15处差别。


对,我的意思就是,多练!!!毕竟勤能补拙。
做法很简单,你只需要把他们叠加在一起,并且给处于上层的图片增加一个CSS filter。完整代码如下:

Read More...

众所周知,浏览器会为我们创建基本的样式。比如<h2>,我们不需要为它写任何css样式,在浏览器上展示出来,一眼就只知道它是大标题。问题是,不同浏览器之间的默认效果不尽相同,于是乎,在Chrome下很漂亮的样式,去到Firefox下可能整个页面都变得一团糟(当然也有可能是其他原因)。

举个栗子,IE浏览器下的<ul>标签的margin-left值为30pt,但是在Firefox,Chrome,Safari<ul>默认属性是padding-left:40px。所以我们需要考虑下浏览器兼容性。

###IE盒子模型
http://static.w3ctrain.com/ie_box_model.jpg

Read More...
1