美文网首页
CSS-列表的样式

CSS-列表的样式

作者: 测试探索 | 来源:发表于2022-06-04 09:55 被阅读0次

    一、列表样式介绍

    image.png
    image.png

    二、目录结构和代码

    image.png

    index.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <link rel="stylesheet" type="text/css" href="index.css">
    </head>
    <body>
        <p>http://www.baidu.com</p>
        <p class="p1">test</p>
         <p>散文,汉语词汇,拼音是sǎn wén。一指文采焕发;二指犹行文; [1]  三指文体名。随着时代的发展,散文的概念由广义向狭义转变,并受到西方文化的影响。
    散文是一种抒发作者真情实感、写作方式灵活的记叙类文学体裁。“散文”一词大概出现在北宋太平兴国(976年12月-984年11月)时期。
    《辞海》认为:中国六朝以来,为区别韵文与骈文,把凡不押韵、不重排偶的散体文章(包括经传史书),统称“散文”。后又泛指诗歌以外的所有文学体裁。</p>
    
        <ul>
            <li>aaaa</li>
            <li>bbbb</li>
            <li>cccc</li>
            <li>dddd</li>
            <li>eeee</li>
    
        </ul>
    
        <ol>
            <li>aaaa</li>
            <li>bbbb</li>
            <li>cccc</li>
            <li>dddd</li>
            <li>eeee</li>
    
        </ol>
    
    </body>
    </html>
    

    index.css

    p{
        color: #ff1493;
        direction: ltr;
        letter-spacing: 5px;
        line-height: 30px;
        text-align: justify;
        font-family: 隶书, serif;
        font-style: oblique;
        font-weight: bold;
        font-size: 15px;
    }
    
    ul{
        list-style-type: circle;
        list-style-position: inside;
        list-style-image: url("../image/3.png");
    }
    
    ol{
        list-style-type: lower-latin;
    }
    
    image.png

    相关文章

      网友评论

          本文标题:CSS-列表的样式

          本文链接:https://www.haomeiwen.com/subject/awjgprtx.html