zoukankan      html  css  js  c++  java
  • css day1

    1.  插入样式表

          外部样式表

            <head>

            <link rel="stylesheet" href="xxx.css" type="text/css">

            </head>

          内部样式表

            <head>

              <style type="text/css">xxxx</style>

            </head>

          内联样式

            <a style="color:red">hi</a>

          优先级比较:外部样式表<内部样式表<内联样式表

    2.  选择器

          类选择器

            HTML  <div class="z"></div>

            css    .z{backgroundcolor:red}

          标签选择器

            HTML  <p></p>

            css    p{color:grey}

            调用了此css文件的网页在用到p的时候他的css样式都会得到继承

          id选择器

            HTML  <p id="select"></p>

            css    #select{color:green}

            id选择器在同一个页面内只能被使用一次,id是唯一的。

          派生选择器包括子选择器,后代选择器,相邻兄弟选择器

          

          子选择器

            HTML  <p><strong>haha</strong></p>

                 <p><em>lalala<strong>123</strong></em></p>

                 <p><em>wuwu</em><strong>233</strong></p>

            css    p>strong{color:red}

            此选择器代表strong的上一级必须是p才有效,两者之间不能穿插其他标签

            haha就具有效果,但是123就不具有效果,因为strong的上一级是em

            但是233还是具有效果,因为em和strong标签是同级的。

          

          后代选择器

            HTML  <p><em>haha</em></p>

            CSS   p em{color:red}

            此选择器只要是在p标签中的em都会具有效果,中间穿插其他标签也无妨。

          

          类选择器和ID选择器的派生选择器

            例如类选择器

            HTML  <div class="air><p>red</p></div>

            css    .air p{color:red}

            类名为 air 的比<p>更大的元素内部的p标签里都是红色,air可以使div也可以是其他标签的选择器。

            基于类被选择的元素

            HTML  <p class="ballon">hi</p>

            css    p.ballon{color:red}

  • 相关阅读:
    jquery toggle(listenerOdd, listenerEven)
    struts quick start
    hdu 1518 Square (dfs)
    hdu 2544 最短路 (最短路径)
    hdu 1754 I Hate It (线段树)
    hdu 1856 More is better (并查集)
    hdu 1358 Period (KMP)
    hdu 2616 Kill the monster (DFS)
    hdu 2579 Dating with girls(2) (bfs)
    zoj 2110 Tempter of the Bone (dfs)
  • 原文地址:https://www.cnblogs.com/swii/p/5312264.html
Copyright © 2011-2022 走看看