css的使用

2018-06-24 02:13:50来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

最近发现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属性清除浮动

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:(转)用JS实现表格中隔行显示不同颜色

下一篇:博客园 css页面定制代码