CSS学习

--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;
         }
  • 35
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值