CSS中样式技巧

来源:互联网 发布:51单片机下载器 编辑:程序博客网 时间:2024/05/21 05:43

1.当元素使用display: inline-block时,注意设置font-size:0,使得他们间隙为0

2.文本水平居中: text-align:center

垂直居中:一:vertical-align: middle

二:height=line-height

3.有时候三个盒子属性均为display: inline-block时,需要设置vertical-align: top使其顶部对齐。


使用css实现下拉列表样式总结

1.注意要重置样式,取消默认样式。

2.使用border实现三角

3.三角是作为span元素的伪元素。注意它的绝对定位是相对于span元素的content定位,而不是整个元素。好处是:当下三角变为上三角时,容易转换位置。

4.下拉列表也采用绝对定位,top: 100%;top为父元素的高度,不包括margin。
    width: 100%;与父元素同宽,添加border时,注意:box-sizing: border-box;
5.添加动画时机:只要元素属性值发生变化,就可添加动画。

6.overflow属性的应用:当内容超过元素高度时设置


原创粉丝点击