黑马程序员<CSS样式总结>

---------------------- ASP.Net+Android+IO开发S、.Net培训、期待与您交流！ ----------------------

学习内容：样式表：CSS

               CSS（层叠样式表）是用来美化页面用的，可以对页面元素进行更精细的设置，主要描述元素的字体颜色，背景颜色，边框等。css主要有元素内联，页面嵌入和外部引用三种使用方式。

                元素内联：直接将样式写入元素的style属性中.

                  页面嵌入：在head中加入。

                 外部引用：将CSS内容写入CSS后缀的文件中。在页面中引用。

                     CSS常见样式： 

                                           css中表示宽度，距离时有多重计量单位：PX(像素)，30%（百分比），em(相对单位)等。

                                            background-color:Red;背景颜色；

                                            color:文本颜色；

                                            border-syle:solid边框风格，实现，还有dotted(点)等。

                                             display:元素是否显示，可选值none(不显示)，block(显示为块级元素)，lnline(显示为内联元素，元素前后没有换行符)等。

                                              cursor，鼠标在元素上时显示的光标图标，可选值：cursor(默认)，polinter(超链接上的手)，text（输入Bean）,wait(忙沙漏)，help(帮助)等。

                         样式选择器：

                                            对于非元素内联的样式需要定义样式选择器，通俗的说就是这个样式适合哪些元素，三种，标签选择器，class选择器，和id选择器。

                                            标签选择器 ：input{border-color:Yellow;color:Red;},对于指定的标签采用统一的样式。

                                             Class选择器：以定义一个命名空间的样式，然后在用到它的时候设定元素的class属性为样式的名称，还可以同时设定多个class,名称之间加空格。                                                                           样式名称开头加“.”   

                                                                   例如：  .exp{ background-color:Red; color:Blue;}        

                                                                                 <input type='text' class="exp" style="background-color:black;" />  

                                              id选择器：为指定Id的元素设定样式，id前加# 

                                                                 例如：  #exp{ background-color:Red; color:Blue;}

                                                                     <input type='text' id="exp" style="background-color:black;" />    

                           样式的优先级：当冲突时，style是覆盖class内容的

                               例子：

                                            #exp{ background-color:Red; color:Blue;}

                                         <input type='text' id="exp" style="background-color:black;" />    那么背景会变成黑色。

---------------------- ASP.Net+Android+IO开发S、.Net培训、期待与您交流！ ----------------------