今天的学习内容:
-----------------------------------------------------正文------------------------------------------------------------
如果要在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 /*参数解释 横向阴影像素 纵向阴影像素 颜色*/