LanceT Blog

Category: CSS布局

不固定宽度水平居中

效果: 水平居中代码: //html部分 <div class="container"> <div class="center"><a href="#">1</a><a href="#">2</a><a href="#">3</a> <div style="clear:both"></div></div> //css部分 .ce...

去除inline-block元素间间距的N种方法

一、现象描述 真正意义上的inline-block水平呈现的元素间,换行显示或空格分隔的情况下会有间距,很简单的个例子: 间距就来了~~ 我们使用CSS更改非inline-block水平元素为inline-block水平,也会有该问题: .space a { display: inline-block; paddin...

img 下方空白(理解baseline)

要理解这个问题,首先要弄明白CSS对于 display: inline 元素的 vertical-align 各个值的含义。vertical-align 的默认值是 baseline,这是一个西文排版才有的概念: 可以看到,出现在baseline下面的是 p 啊,q 啊, g 啊这些字母下面的那个尾巴。可以看到,出现在bas...

margin 问题汇总

1.父元素与子元素之间的margin-top问题

父元素的盒子包含一个子元素盒子,给子元素盒子一个垂直外边距margin-top,父元素盒子也会往下走margin-top的值,而子元素和父元素的边距则没有发生变化。
2013319162033660

Meyerweb css reset初始化

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd,...

布局注意事项

1. 更好的清除浮动 /* For modern browsers */ .cf:before, .cf:after { content:""; display:table; } .cf:after { clear:both; } /* For IE 6/7 (triggers hasLayout) */ .cf { *zoom:1; } 2. 块元素注意事项 默认宽度占全行 宽度、行高都可控,宽度也可...

height:auto 和 height:100% 区别

height:auto,是指根据块内内容自动调节高度。 height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高度的父层的高度来定义高度。

CSS各种居中方法

水平居中的text-align:center 和 margin:0 auto 这两种方法都是用来水平居中的,前者是针对父元素进行设置而后者则是对子元素。他们起作用的首要条件是子元素必须没有被float影响,否则一切都是无用功。margin:0 auto 也可以被写成margin:0 auto 0 auto。不能理解的...