CSS学习-20180824

今日学习一点CSS；
一、语法

1.在head部声明样式
<style type="text/css">         
    div{
        background-color:white;
        color:blue;
        height:300px;
        width:500px;
        text-align:center;
    }
    .p{
        background-color:yellow;
        color:red;
        height:100px;
        text-align:center;
        display:table-cell;
        vertical-align:middle;          
    }
</style>
2.在body部引用样式
    <p class="p">class类选择器定义的样式</p>
优先级：行内样式>内联样式>外联样式

二、选择器

选择器	样式表示
标签选择器	“p{}”
id选择器	“#p{}”
class选择器	“.p{}”
伪类选择器	“p:hover{}”
奇偶选择器	“p:nth-child(2n+1){}”

三、div中的样式
1.文字

属性	语法
大小	font-size:30px;
字体	font-family:”宋体”;
加粗	font-width:200px;
颜色	color:red;
下划线	text-decoration:underline;
倾斜	font-style:oblique;
倾斜	font-style:italic;
单词间距	word-spacing:20px;
字母间距	litter-spcing:5px;

2.文字位置

属性	语法
居左右和自适应	text-align:left/right/justify;
水平居中	text-align:center;
垂直居中	display:table-cell;vertical-align:middle;

四、p中的样式
1.文字

属性	语法
大小	font-size:30px;
字体	font-family:”宋体”;
加粗	font-width:200px;
颜色	color:red;
下划线	text-decoration:underline;
倾斜	font-style:oblique;
倾斜	font-style:italic;
单词间距	word-spacing:20px;
字母间距	litter-spcing:5px;

2.文字位置

属性	语法
居左右和自适应	text-align:left/right/justify;
水平居中	text-align:center;
垂直居中	display:table-cell;vertical-align:middle;