CSS基础教程之列表及边框属性

CSS列表属性

项目符号或编号前面的各种符号无法改变样式,所以在实际中我们一般不用。

  • list-style:列表样式,取值:none。去掉项目符号或编号前面的各种符号。

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        ul,li{list-style:none;}/*去掉前面的符号*/
    </style>
    </head>
    <body>
        <ul>
            <li>HTML+CSS</li>
            <li>JavaScript</li>
            <li>MySQL</li>
            <li>PHP</li>
        </ul>
    </body>
</html>

CSS边框属性:每个元素都可以加边框线

  •  border-left:左边框线。

  •  格式:border-left:粗细  线型  线的颜色;

  •  线型:none(无线)、solid(实线)、dashed(虚线)、dotted(点状线)

  •  举例:border-left:5px  dashed  red;

  • border-right:右边框线。

  • border-top:上边框线。

  • border-bottom:下边框线。

  • border:同时给四个边加边框线。

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        .box{
            background-color:#66ff66;
            width:200px;
            height:200px;
            border-left:6px solid red;
            border-right:3px dashed blue;
            border-top:5px dotted black;
        }
    </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>


继续学习
||
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> <style type="text/css"> ul,li{list-style:none;}/*去掉前面的符号*/ </style> </head> <body> <ul> <li>HTML+CSS</li> <li>JavaScript</li> <li>MySQL</li> <li>PHP</li> </ul> </body> </html>
提交重置代码
章节
笔记
提问
课件
反馈
捐赠

HTML+CSS基础入门教程