Web入门（二）

1 CSS是使用方式

    1) 行内样式 <input style=”书写样式” />

    弊端:不利于维护(style属性和html标签混合在一块)

    2) 内部样式

    在head标签体中,书写style标签

        <style type=”text/css”>

        书写样式;

        </style>

    3) 外部样式

        A:创建一个独立一后缀名为.css结尾的css文件

        选择器{

          书写样式

               }

        B:导入外部css文件

           书写:<link href=”xx.css” rel=”stylesheet”/>

2  CSS的语法

    选择器(id选择器,类选择器,标签选择,并集选择器,交集选择器,通用选择器){

        CSS属性:CSS的属性值;

        CSS属性(字体,背景,边框,背景图片的起始位置…(大小,颜色,边框的样式,边框的尺寸left/center/right…)

    }

3 CSS的选择器

    a 标签选择器(最普通一种方式)

    标签名称{

            CSS属性:css属性值;

        }

    b id选择器

        在标签中一定要给定一个id属性,并且指定id属性值

          <input type=”text” id=”inputId” >

       书写格式:

        #id属性值{

            书写样式;

        }

        1) 一个标签同时被标签选择和id选择器选中,那么id选择器的优先级要高于标签选择器

       2)在同一个html页面中,不要给多个标签指定同名id属性,如果指定同名id属性值,那么js的时候,获取标签对象的时候,获取不到:getElementById(“id属性值”) ;

   c 类选择器

    <input type=”text” class=”inputCls”>

      .class属性值(inputCls){

    书写样式;

      }

     在同一个页面下,多个标签可以指定同名的class属性

4 伪类选择器

    伪类表示一种状态:超链接标签a的几种状态

            link:鼠标没有访问过的状态

            hover:鼠标经过的状态

            active:鼠标激活状态(鼠标点击了,但是没有松开的状态)

            visited:鼠标访问过的状态(已经点击了,并且松开的状态)

    书写格式:  a:四个状态{….}

    显示的效果顺序:link visited hover active

5 CSS常用属性

    1.文本属性   如：颜色，行高，间距等；

    2.字体属性   如：font :  italic bold 36px "黑体" ;

    3.背景属性   如：背景颜色，背景图片等；

    4.列表属性   如：list-style-type:设置列表项前面的类型；

    5.表格属性   如：表格的框，长，高，对齐方式等；