--rel描述当前页面与href所指定网页的关系
当使用简写属性时,属性值的顺序为::
-
background-color
-
background-image
-
background-repeat
-
background-attachment
-
background-position
body {background:#ffffff url('img_tree.png') no-repeat right top;}以上属性无需全部使用,你可以按照页面的实际需要使用.
CSS 背景属性
Property | 描述 |
---|---|
background | 简写属性,作用是将背景属性设置在一个声明中。 |
background-attachment | 背景图像是否固定或者随着页面的其余部分滚动。 |
background-color | 设置元素的背景颜色。 |
background-image | 把图像设置为背景。 |
background-position | 设置背景图像的起始位置。 |
background-repeat | 设置背景图像是否及如何重复。 |
文本排列属性是用来设置文本的水平对齐方式。h1 {text-align:center;}
文本可居中或对齐到左或右,两端对齐.p.date {text-align:right;}
当text-align设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐(如杂志和报纸)。p.main {text-align:justify;}
text-decoration 属性用来设置或删除文本的装饰。从设计的角度看 text-decoration属性主要是用来删除链接的下划线:h1 {text-decoration:overline;} h2 {text-decoration:line-through;} h3 {text-decoration:underline;}
可用于所有字句变成大写或小写字母,或每个单词的首字母大写。
p.uppercase {text-transform:uppercase;}HELLO p.lowercase {text-transform:lowercase;}hello p.capitalize {text-transform:capitalize;}Hello World
文本缩进属性是用来指定文本的第一行的缩进。p {text-indent:50px;}
letter-spacing:3px; line-hight:70%; word-spacing:30px overline line-through underline
所有CSS文本属性。
属性 | 描述 |
---|---|
color | 设置文本颜色 |
direction | 设置文本方向。 |
letter-spacing | 设置字符间距 |
line-height | 设置行高 |
text-align | 对齐元素中的文本 |
text-decoration | 向文本添加修饰 |
text-indent | 缩进元素中文本的首行 |
text-shadow | 设置文本阴影 |
text-transform | 控制元素中的字母 |
unicode-bidi | 设置或返回文本是否被重写 |
vertical-align | 设置元素的垂直对齐 |
white-space | 设置元素中空白的处理方式 |
word-spacing | 设置字间距 |
1em和当前字体大小相等。在浏览器中默认的文字大小是16px。
因此,1em的默认大小是16px。可以通过下面这个公式将像素转换为em:px/16=em
所有CSS字体属性
Property | 描述 |
---|---|
font | 在一个声明中设置所有的字体属性 |
font-family | 指定文本的字体系列 |
font-size | 指定文本的字体大小 |
font-style | 指定文本的字体样式 |
font-variant | 以小型大写字体或者正常字体显示文本。 |
font-weight | 指定字体的粗细。 |
body{ background: url(2.jpg) no-repeat center fixed; background-size: cover; } body{ background: url(2.jpg) no-repeat center fixed; background-size: cover; color:rgb(251, 152, 177); font: italic 30px/2 幼圆; line-height: 30px; line-break: normal; text-indent: 2em; } a:hover {悬停 text-decoration: none; color: black; }