解释一段css代码

html-css018

解释一段css代码,第1张

#leftcolumn a{                  /* ID为 leftcolumn 的 a链接 样式 */

 display:block                /* 变换a标签为块级元素,这样就可以设定宽高等属性了 */

 color:#333333                /* a链接的颜色为  #333333 */

 background-color:#d6d6d6                /* 背景颜色为 #d6d6d6 */

 margin-bottom:2px                /* 下外边距为2像素 */

 padding:2px                /* 内边距为2像素 */

 text-decoration:none                /* 链接无下划线 */

 font-weight:bold}                /* 字体为粗体 */

下面看效果

下面是代码

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>d</title>

    <style>

        * {

            margin:0

            padding: 0

        }

        #leftcolumn a {

            display:block

            color:#333333

            background-color:#d6d6d6

            margin-bottom:2px

            padding:2px

            text-decoration:none

            font-weight:bold

        }

    </style>

</head>

<body>

    <br/>

    <div class="" id="leftcolumn"><a href="#">ID为leftcolumn的a标签</a></div>

    

</body>

</html>

id是页面中Div标签的ID,在一个网页中,具有唯一性(即:只能使用一次)

class是div的样式类名,在一个网页中,可以使用多次。

但是,id的优先级要高于class的优先级。例如:

#test{height:30px}

.style{height:20px}

<div id="test" class="style"></div>

这个div的高度是30px,而不是20px