zoukankan      html  css  js  c++  java
  • 【2017-03-24】CSS样式表

    一、样式表的分类

    1.内联式             优先级最高,重用性最差,常用

    当特殊的样式需要应用到个别元素时,就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性,样式属性可以包含任何 CSS 属性

    格式:

    <div style="100px;height:100px;border:1px solid black">这里是内容</div>

    2.内嵌式             优先级和重用性都一般,不推荐使用

    当单个文件需要特别样式时,就可以使用内嵌样式表。需要在 head 部分通过 <style> 标签定义内部样式表

    格式:

    <style type="text/css">

    .div1{

    100px;

    height:100px;

    background-color:red;

    }

    </style>

    (在body部分使用div1)

    <div class="div1"></div> 

    3.外部式             优先级最低,重用性最高,常用

    当样式需要被应用到很多页面的时候,通常使用外部样式表

    方法:

    创建样式表文件.css,添加样式表内容

    .div1{

    100px;

    height:100px;

    background-color:red;

    最后在html中调用该格式:将css文件拖到html的<head></head>中或者在<head></head>中输入代码:<link href="css文件的路径" rel="stylesheet" />

    二、选择器

    1、id选择器

    优先级第一,只能选中一个元素。可以覆盖掉其他选择器

    #ddd1{

     css属性

    }

    2、class选择器(类别选择器)

    优先级第二,可以选中一堆元素。

    .div1{

     css属性

    }

    3、标签选择器

    根据标签名进行选择,如div、span   优先级最低,能选中一堆元素,不建议使用

    div{

     css属性

    }

    4、复合选择器

    (1)群组选择器

    当几个元素样式属性一样时,可以共同调用一个声明,元素之间用逗号分隔

    .div1,.div2,#ddd1{

     css属性

    }

    (2)后代选择器(包含选择器)

    用来选择特定元素或元素组的后代,将对父元素的选择放在前面,对子元素的选择放在后面,中间加一个空格分开

     .div1 #ddd1{

    css属性

    }

  • 相关阅读:
    Speech_recognition
    Unity3D
    Kinect
    matlab
    debian install
    menu.lst
    RStudio
    System.BadImageFormatException
    C语言期末复习划重点啦!赶上复习的末班车,祝你期末考试不挂科!
    程序员的中年危机:不是物质的匮乏,而是身份的焦虑
  • 原文地址:https://www.cnblogs.com/snow22546/p/6618499.html
Copyright © 2011-2022 走看看