（2）前端 - CSS - css选择器学习

css的选择器的学习：

                   标签选择器的学习：

                         标签选择器：

                         

                   id选择器:

                         #标签的id属性值{样式名1：样式值1；.....}

                         作用：给某个指定的标签添加指定的样式

                         

                   类选择器：

                         .类选择器名{样式名1：样式值1；.....}

                         作用：给不用的标签添加相同的样式

                         

                   全部选择器：

                         *{样式名1：样式值1；.....}

                         作用：选择所有HTML标签，并添加相同的样式

                    --------------------------------------------------------------------------

                   组合选择器：

                         选择器1，选择器2，....{

                         样式名1：样式值1；.....

                         }

                         作用：解决不同的选择器之间重复样式的问题

                         

                   子标签选择器：

                         选择器1 子标签选择器{ 样式名1：样式值1；.....}

                         

                   属性选择器：

                         标签名[属性名=属性值]{ 样式名1：样式值1；.....}

                         作用：选择某标签指定具备某属性并且属性值为某属性值的标签

                         

                 CSS使用过程：1.声明css代码域

                             2.使用选择器选择要添加样式的标签

                                   使用*选择器来给整个页面添加基础样式

                                   适应类选择器给不同的标签添加基础样式

                                   适应标签选择器给某类标签添加基础样式

                                   适应id，属性选择器，style属性声明方式给某个标签添加个性化样式

                             3.书写样式单

                                   边框设置       border：solid 1px；   solid代表实线

                                   字体设置       font-size：10px；     设置字体大小

                                                 font-family："黑体"；  设置字体样式

                                                 font-weight：bold；   设置字体加粗

                                   字体颜色设置   color：颜色

                                   背景颜色设置   background-color：颜色

                                   背景图片设置   background-img：url（图片的相对路径）

                                                 background-repeate：on-repeate；设置图片不重复

                                                 background-size：cover；图片平铺整个页面

                       

                                   高和宽设置

                                   浮动设置       float：left|right

                                   行高设置       line-height:10;

 

 

运行结果：