Div的几种选择器

Div 是一个html标签，一个块级元素（单独显示一行），单独使用没有意义，需要结合CSS来使用，主要用于页面的布局。

div选择器：

1.元素选择器：

 1     <style>
 2                 div{
 3             font-size: 5px; 
 4             color: red;
 5          }            
 6     </style>
 7     <body>
 8         <div >
 9             你停在了那条我们熟悉的街。
10         </div>
11     </body>

2.类选择器：

 1     <style>
 2                 .div2{
 3             font-size: 5px; 
 4             color: red;
 5          }            
 6     </style>
 7     <body>
 8         <div  class="div2">
 9             你停在了那条我们熟悉的街。
10         </div>
11     </body>

3.id选择器：

 1     <style>
 2                 #div3{
 3             font-size: 5px; 
 4             color: red;
 5          }            
 6     </style>
 7     <body>
 8         <div  id="div3">
 9             你停在了那条我们熟悉的街。
10         </div>
11     </body>

4.层级选择器

 1     <style>
 2                div  font{
                font-size: 40px; 
                color:brown;
            }           
 6     </style>
 7     <body>
 8             <div>
            把你准备好的台词全念一遍。
            <font> 爱你到最后 不痛不痒</font>
        </div>
11     </body>

5.属性选择器：

 1     <style>
 2               input[type = 'text']{
            font-size: 40; 
                color: yellow;
            }           
 6     </style>
 7     <body>
 8            <div>
            我们的爱 <input type="text" name="password" />
        </div>
11     </body>

6.行内引入：

1 <div style="color: orange; font-size:20px ;">
2 怪我没能力跟随。
3 </div>

7.外部引入

style1.css文件中
     div{
             font-size: 5px; 
             color: red;
           } 

利用link导入：
<html>
    <head>
        <meta charset="UTF-8">
        <title> div选择器</title>
            <link rel="stylesheet" href="style1.css" type="text/css"/>
    </head>
    <body>
        <div>
            你还要我怎样
        </div>
    </body>
</html>

 

Div 浮动特性

left:左侧不允许浮动元素

right:右侧侧不允许浮动元素

both 两侧都不允许浮动元素

none 默认值 两侧都允许浮动元素

inherit 从父元素继承clear属性值。

添加浮动 用float,清除浮动用clear。

 

posted on 2017-11-01 20:40  swiftF  阅读(1113)  评论(0)  编辑  收藏  举报

导航