css基础

隐身守侯 提交于 2019-11-27 02:16:18
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- style内容写css语言 -->
    <style>
        /* *选中所有元素 */
        * {
            width: 300px;
        }

        /* 元素选择器--html元素 xxx 表示选中所有xxx元素
        body 表示所有的body元素
        div 表示所有的div元素*/
        body {
            /* height 给元素设置高度;值大于等于0 */
            height: 100px;
            /* background-color: 设置背景颜色 */
            background-color: red;
        }

        div {
            height: 100px;
            background-color: yellow;
            /* border 设置元素边框
                2px 边框的宽度为2px
                red 边框的颜色为红色
                solid 边框为实线 */
            border: 2px solid red;
        }

        /* id 选择器使用方式
        1.给标签添加行内属性id 且赋值
        2. 在css中#id值选中具有id行内属性且值为xxx的元素*/
        #content {
            background-color: blue;
        }

        /* class选择器:可以选中多个元素
        作用:选中 */
        .div {
            background-color: bisque;
        }
    </style>
</head>

<body>
    <!-- id 属性:具有唯一性;他的值是自定义的 例如:zhenghang -->

    <div id="content">

    </div>
    <div class="div">我是001</div>
    <div class="div">我是002</div>
    <div>我是003</div>
</body>

</html>
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!