最近发现css遗忘了很多,原因在于平时很少用到一些样式,现记录一些平时工作中使用频率比较少的属性以备查看。因为本身就知道这些属性,只不过用的少而已,所以不会太详细的记录,只是记录大概的意思,一看就能了解。
1.文本属性
text-indent
首行文本缩进,针对于块级元素,text-indent 可以使用所有长度单位,包括百分比值。百分比是相对于父级元素设置的。
text-align:justify
文本对齐属性值中有个justify是两端对齐,之前用的比较多的是center,right,left较多。
word-spacing
默认值normal相当于设置为0,
letter-spacing
字母间隔,与word-spacing相比字母间隔修改的是字符或字母之间的间隔。
text-transform
处理文本的大小写,默认值 none 对文本不做任何改动,将使用源文档中的原有大小写。顾名思义,uppercase 和 lowercase 将文本转换为全大写和全小写字符。capitalize 只对每个单词的首字母大写。
text-decoration
underline 会对元素加下划线,就像 HTML 中的 U 元素一样。overline 的作用恰好相反,会在文本的顶端画一个上划线。值 line-through 则在文本中间画一个贯穿线,等价于 HTML 中的 S 和 strike 元素。blink 会让文本闪烁,类似于 Netscape 支持的颇招非议的 blink 标记。
2.定位与浮动
css三种定位机制:普通流、浮动和绝对定位。除非专门指定,否则所有的框都在普通流中定位,而普通流中的元素位置由元素在html中的位置决定。
2.1定位的position属性
static
元素框正常生成,块级元素生成一个矩形框,作为文档流的一部份;行内元素则创建一个或则多个行框置于其父元素中。
relative
绝对定位:元素偏移某个距离,而这个偏移是相对于元素本身,且原占有的空间仍在。
在这里突然想起来visibility和display的区别,两者都会隐藏元素,但是有区别,visibility:hidden仍然占用以前的空间,而display:none不在文档流中。
absolute
相对定位:元素脱离了文档流,可以形成层叠的效果(z-index属性值越大该层越在上),相对于父级元素的定位,如果父级没有定位则再往上找定位的元素直至body元素。所以一般使用absolute定位时会使用relative来配合使用。
fixed
固定定位:这里所固定的参照对像是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。
浮动元素之后可以使用top,left,right,bottom来定义偏移的距离
2.2浮动float
浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。浮动也会脱离文档流,所以文档流中的元素表现的像浮动元素不存在一样
使用浮动之后一定要记得在后面清理浮动,可以给浮动元素的父元素设置高度,后续元素使用clear属性清除浮动
- 还没有人评论,欢迎说说您的想法!