2.2 CSS3基本语法 + 选择器

浏览数：43 / 时间：2015年06月09日

1. 基本语法

　　selector1, selector2{

　　　　property1 : value1;

　　　　property2 : value2;

　　}

　　如果value大于1个单词(如font-family的值可能是sans serif), 需要加上引号(font-family:"sans serif")

 

2. 高级语法

　　继承效果

 

3. 派生选择器

　　依据 元素位置的 上下文关系 定义样式

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="mycss.css">
</head>
<body>
    <p>
        <strong>派生选择</strong>
    </p>
</body>
</html>
//派生选择 标签从外到内用空格隔开
p strong{
    color: aqua;
}

 

4. id 选择器

　　为标有 id 的元素 指定样式, 以 # 来定义

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="mycss.css">
</head>
<body>
    <p id="pid">
        <strong>派生选择</strong>
    </p>
</body>
</html>
//id选择器用#表示, 上下文位置又是派生选择器, 两者一起使用
#pid strong{
    color: aqua;
}

 

4. 类选择器

　　用.来表示

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="mycss.css">
</head>
<body>
    <p class="pclass">
        <strong>派生选择</strong>
    </p>
</body>
</html>
//类选择 和 派生选择 结合使用
.pclass strong{
    color: aqua;
}

 

5. 属性选择器

 　　

 

　　

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style log 使用 html it la ha sp class style log 使用 html it la ha sp

相关文章

随机文章

您可能还喜欢

您可能还喜欢