CSS学习笔记第一天

今天的学习内容:



-----------------------------------------------------正文------------------------------------------------------------




如果要在HTML元素中设置CSS样式,有三种方式,id选择器,class选择器,还可以指定特定的HTML元素使用class

注意,id和类名的第一个字符均不能使用数字,例      #1Abstauct(X)   .1Abstauct(X)

id选择器实例:


class选择器实例:


指定HTML元素使用class:


--------------------------------------------------假装有分割线----------------------------------------------------------------


background-repeat:







文本对齐方式:

text-align:center       /*文本可居中*/

text-align:right         /*文本可对齐到左或右,左是left*/

text-align:justify         /*文本可两端对齐,可调整屏幕大小查看效果*/

文本装饰:

text-decoration:none            /*用来设置或删除文本的装饰,这个就是删除a标签的下划线*/

text-decoration:overline       /*用来设置或删除文本的装饰,这个就是设置文本的上划线*/

text-decoration:line-through       /*用来设置或删除文本的装饰,这个就是设置文本的中划线*/

text-decoration:underline           /*用来设置或删除文本的装饰,这个就是设置文本的下划线*/

文本转换:

text-transform:uppercase           /*文本全部转换成大写*/

text-transform:lowercase            /*文本全部转换成小写*/

text-transform:capitalize             /*文本全部转换成首字母大写*/

文本缩进:

text-indent:50px           /*文本第一行缩进50px*/

指定字符之间的空间:

letter-spacing:2px            /*效果     This is heading 1*/

letter-spacing:-3px          /*效果     This is heading 2    */

一个段落中行与行之间的空间:

line-height:70%

line-height:200%


设置元素的文本方向:

direction:rtl             /*文本元素右向左*/

direction:ltr            /*文本元素左向右*/

设置单词之间的空白空间(对中文无效):

word-spacing:30px

在元素内禁用元素环绕:

white-space:nowrap            /*禁用文字环绕*/

设置垂直对齐图像(默认为底部对齐):

vertical-align:text-top            /*顶部对齐*/

vertical-align:text-bottom            /*底部对齐*/

添加文本阴影:

text-shadow:2px 2px #FF0000        /*参数解释    横向阴影像素   纵向阴影像素    颜色*/



猜你喜欢

转载自blog.csdn.net/dai_aixy/article/details/80549493
今日推荐