码迷,mamicode.com
首页 > 其他好文 > 详细

选择器

时间:2017-04-03 23:38:27      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:name   doc   密码   rdo   round   举例   选择器   xxx   swa   

伪类选择器:

     <!DOCTYPE html>

         <html>

          <head lang="en">

          <meta charest="utf-8">

         <title>伪类选择器举例</title>

        <style>

         p:first-letter:{

                  font-weight:bold;

                  color:#43193c;

                  margin-right:15px;

                  margin-bottom:15px;

                  font-size:18px;

                         }

           p:first-line{ 

                      font-weight:bold;

                         color:yellow;

             }

         p:selection{

                     color:yellow;

                     background-color:#000

                        }

        </style>

         <body>

            <p>这是一段p元素,xxx<br>这是另外一段p元素</p>

         </body>

         </html>

         </head>

兄弟选择器:

     <!DOCTYPE html>

        <html></html>

        <head lange="en">

        <meta charset="utf-8">

       <title>兄弟选择器</title>

      <style>

   /*#p1+p{color:red;}*/

  /*p+p{color:blue;}*/

   #p1~#p2{

        color:orange

       }

     </style>

       </head>

     <body>

    <p id="p1"> 第一个p元素 <p>

    <p id="p2">第二个p元素<p>

    <p id="p3">第三个p元素<p>

   </body>

</html>

  元素状态伪类:

    <!DOCTYPE html>

        <html>

       <head lang="en">

       <meta charest="utf-8">

        <title>元素状态伪类</title>

         <style>

         input:enabled{

                   color:green;

           }

       input:disabled{

                   color:red;

                   }

      input:checked{

         background-color:red;

     }

        </style>

</head>

<body>

<p>

用户名称:<input  value="请输入用户名称" disabled>

</p>

<p>

用户密码:<input type="passward" value="">

</p>

<p>

用户性别:<input  type="radio"  name="rdo"  value="0">男

              <input type="radio"  name="rdo"   value="1">女

 </p>

</body>

</html>

 

 

 

 

 

 

        

 

选择器

标签:name   doc   密码   rdo   round   举例   选择器   xxx   swa   

原文地址:http://www.cnblogs.com/zhangailing/p/6663988.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!