这里要给大家解释一下权重的事,这个很重要,权重在这里是选择器之间的优先级,
行内选择器权重最高,其次是内嵌式,之后是外联式
多个选择器作用同一标签,相同类型不同效果下,权重大的覆盖权重小的
比如外联式字体变蓝色,内嵌式变红色,行内式变黑色,那么标签内字体变黑色
还有选择器之间也有权重,权重大的覆盖权重小的,这个自行搜资料了解
.a{
text-align: center; /* 文字水平居中 */
/* text-align: left; 文字水平居左 */
/* text-align: right; 文字水平居右 */
/* text-align: justify; 文字两端对齐 */
}
.b{
text-indent: 2em; /* 文字首行缩进 */
/* text-indent: -2em; 文字首航悬挂,就是文字往左突出 */
}
.c{
/* text-decoration文字装饰效果 */
/* text-decoration: underline; 文字加下划线 */
/* text-decoration: line-through; 文字加删除线也叫中划线 */
text-decoration: overline; /* 文字加上划线, */
/* text-decoration: none; 文本无修饰,去除文本修饰效果,常用来去除超链接的下划线 */
}
.d{
text-transform: uppercase; /* 全部大写 */
/* text-transform: lowercase; 全小写 */
/* text-transform: capitalize; 单词首字母大写 */
letter-spacing: 20px; /* 字母语字母的间距,汉字与汉字间的距离 */
/* word-spacing: 20px; 单词与单词之间的距离 */
}
.e{
width: 150px;
background-color: red;
white-space: nowrap; /*不换行*/
/* text-overflow: clip; 不显示省略标记,简单裁切 */
text-overflow: ellipsis; /*文本溢出显示省略标记*/
/* overflow: visible; 默认 溢出部分可见 */
overflow: hidden; /*溢出部分隐藏*/
/* overflow: scroll; 显示滚动条 */
/* overflow: auto; 浏览器自行处理 */
/* vertical-align: baseline; 行内元素垂直对齐 */
}
*{
border: #FF0000;
}
/* *{}这是通配符选择器,选择所有元素 */
/* 大部分用于做元素格式化,看不懂的网上查,我也迷糊 */
/* 权重最低,可以被其他标签覆盖 */
/*div,span,p{
color: #FF0000;
}
这个是分组选择器,用于多个标签用相同修饰用,用逗号隔开*/