CSS-样式列表-绝对定位

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>列表样式</title>
        
        <style type="text/css">
            /*css样式*/
            ul{
                /*list-style-type: none;*/
                list-style-type: square;
            }
        </style>
        
    </head>
    <body>
        <ul>
            <li>中国
                <ul>
                    <li>北京</li>
                    <li>上海</li>
                    <li>重庆</li>
                </ul>            
            </li>
        </ul>
        <ul>美国</ul>
        <ul>俄国</ul>
        
    </body>
</html>
!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>css样式的绝对定位</title>
        
        <style type="text/css">
            #div1{
                background-color: red;
                border: 1px solid black;
                width: 300px;
                height: 300px;
                position: absolute;/*绝对定位*/
                left: 100px;/*左边边框*/
                top: 100px;/*顶部边框*/
                
            }
        </style>
        
    </head>
    <body>
        
        <div id="div1">    </div>
        
    </body>
</html>

 

posted @ 2022-06-12 13:31  280887072  阅读(46)  评论(0)    收藏  举报