7.8CSS部分的学习!

<!DOCTYPE html>
<html>
<head>
    <title>CSS元素选择器</title>
<style type="text/css">

/*  id选择器
    id 选择器使用 #引入,它引用的是id属性中的值
    html标签   id名字可以重复
*/
    #div1{
        border:1px  dashed red;
    }
/*    类选择器
    类选择器使用时,需要在类前面加一个  .
    在项目开发中,给标签添加属性都是通过类选择器
*/
    .weather{
        color:red;
        border: 1px dashed green;
    }
/*    元素选择器
    这是最常见的选择器,简单说,文档中的元素就是选择器
*/
    div{
        width: 200px;
        height: 200px;
        border:1px solid red;
    }

    span{
        border:1px solid green;
    }
/*    属性选择器
如果需要选择有某个属性的元素，而不论属性是什么，可以使用属性选择器*/
    /*只能改变type = "text" 的属性*/
    input[type = "text"] {
        background-color:yellow;
        border: 1px solid blue;
    }

</style>
</head>
<body>

<div id="div1">
    今天天气不错1....
</div>
<div id="div2">
    今天天气不错2...
</div>
<div class="weather">
今天天气不错4
</div>

<div>习主席</div>
<div>李克强</div>

<span>汪洋</span><br>

<input type="text" placeholder="请输入用户名"><br>
<input type="password" placeholder="请输入密码"><br>
<input type="text" placeholder="请输入地址">
</body>
</html>