PHP第三次3

设计下面导航页面。鼠标置于文字部分，文字能变大。

div样式：宽980px，高150px，背景图在image文件夹里。

li样式：宽84px，字体加粗，margin上距100px，字体10px，line-height24px

其它样式按照图片自设。

 

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文字变大</title>
    <style type="text/css"> 
    .main{
        background: url(E:/大二/PHP/作业/h_bg.jpg) no-repeat;
        width: 980px;
        height: 150px;
    }
    li{
        width: 84px;
        font-weight:bold;
        margin-top: 100px;
        font-size: 10px;
        line-height: 24px;
        float:left;
        text-decoration: underline;
    }
    li:hover{
        font-size: 18px;
    }
    </style>
</head>
<body>
    <div class="main">
        <ul>
            <li>首页</li>
            <li>家用电器</li>
            <li>手机数码</li>
            <li>日用百货</li>
            <li>书籍</li>
            <li>帮助中心</li>
            <li>免费开点</li>
            <li>全球咨询</li>
        </ul>
    </div>
</body>
</html>

 

posted @ 2022-03-16 21:46  好(justice)……  阅读(19)  评论(0)  编辑  收藏  举报