CSS学习:文本排版,颜色,背景,边框,边距
文本的精细排版:
调整字符间距: letter-spacing: normal | 长度
调整单词间距: word-spacing: normal | 长度
添加文字修饰: text-decoration: underline | overline | line-through | blink | none
设置文本排列方式: text-align: left | right | center | justify(两段对齐)
设置段落缩进: text-indent: 长度 | 百分比
调整行高: line-height: normal | 数字 | 长度 | 百分比
转换英文大小写: text-transform: uppercase | lowercase | capitalize(单词首字母大写) | none
颜色和背景:
网页中的每一个元素都有一个前景色和一个后景色, 而且前景色和后景色最好同时设置, 以免重复或冲突.
设置颜色: color:颜色
color属性不是只用来设置字体的颜色, 网页中每个元素的颜色都可以用color属性来设置, color属性设置的颜色一般都为标记内容的前景色.
设置背景颜色: background-color: 颜色 | transparent(透明值)
在CSS中使用background-color属性不仅可以设置网页的背景颜色, 还可以设置文字的背景颜色
插入背景图片: background-image: url | none
Background-image
设置背景图片是否随着滚动条的移动而一起移动
设置重复背景图片: background-repeat: repeat(水平和垂直方向平铺) | repeat-x(水平方向平铺) | repeat-y(垂直方向平铺) | no-repeat(不平铺)
使用background-image属性设置网页的背景图片时, 背景图片总是在水平和垂直方向重复显示并平铺于整个窗口.
将backgrond-image和background-repeat属性结合使用, 就可以方便地控制背景图片的平铺方式.
设置背景图片位置: background-position: 百分比 | 长度 | 关键字
实例:
Code
边框和边距:
边框属性包括边框样式, 边框颜色, 边框宽度, 主要用来设置网页中各个元素的边框, 如段落, 图片, 表格等
设计边框样式: boder-style
border-style:样式取值
border-top-style:样式取值
border-bottom-style:样式取值
border-left-style:样式取值
border-right-style:样式取值
调整边框宽度: border-width
border-width:关键字 | 长度
border-top-width:关键字 | 长度
border-bottom-width:关键字 | 长度
border-right-width:关键字 | 长度
border-left-width:关键字 | 长度
设置边框颜色 border-color
设置边框属性: border 同时设置边框的宽度,样式和颜色
border: 边框宽度 | 边框样式 | 边框颜色
border-top:
border-bottom:
border-right:
border-left:
边距: margin-top / margin-bottom / margin-right / margin-left / margin
用来设置网页中某个元素的四边和网页中其他元素之间的空白距离.
填充: padding-top / padding-bottom / padding-right / padding-left / padding
用来控制边框和其他元素之间的空白距离, 和边距属性很类似.