css

一,css

1,id选择器    #name{}

     类选择器     .name{}

     属性选择器   

     <p title="t"></p>

     <p title="te"></p>

      [title]{}  

      [title="te"]{}

      [title~="title"] 模糊拼配,必须完全包含其中的内容

      其中所谓的title可以是任意的内容,比如说href

     id是唯一的,一般是先找到结构在渲染样式,不能结合使用

     class 先处理好样式,在寻找结构

     组合元素选择器:a.classname{}  可能有许多元素都是classname类型的,但是只针对于a标签中的classname类的起作用

     多类选择器:

 <p class="p1">this is my name</p>
 <p class="p2">this is my name</p>
 <p class="p1 p2">this is my name</p>

.p1{
    font-size: 200px;
}
.p2{
    color: red;
}
.p1.p2{
    font-style: italic;
}

这样子第三个class为p1 p2,会拥有p1,p2所有的字体相关的特性,还可以通过.p1.p2来决定最终的特性。

后代选择器  a p strong{}可以选择后代,比如孙子直接a strong{}

子元素选择器  a>P>strong{} 只能一层层找

相邻兄弟选择器 p+a{}  选择p后面的a标签,要求他们与p有相同的父亲

2, css背景

    background-attachment : fixed//背景图片是否随页面滚动

    background-color

    background-image:url("a.jpg")

    background-position : 100px 200px

    background-repeat

    background-size 

3, padding 内边距

4, 文本

    color

    text-align

    text-indent:2em 缩进两个字符

    text-transfrom

    text-shadow :5px 5px 5px #ff0000;阴影效果

     text-wrap 换行规则

5,字体

    font-family 字体

    font-size : 20px

    fonr-style 

    font-weight 字体的粗细

6,链接

    a:link{}

    a:visited{}

    a:hover{}

    a:active{}

    text-decoration :none 去掉链接样式(下划线等)

    background-color

7,列表

  list-style-type :disc;图标的样式

  list-style-image :url("a.jpg");

  list-style-position 没太有用

8,表格

  border :1px solid blue; 设置外边框

  border- collaspe :collaspe; 折叠边框

9,轮廓(给元素加上轮廓线)

   outline-color

   outline-style

   outline-width

posted @ 2016-09-23 20:29  Zview  阅读(273)  评论(0编辑  收藏  举报