用padding值模拟实现导航

来源：互联网发布：nginx 403 页面定制编辑：程序博客网时间：2024/05/16 13:53

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>padding写导航</title>    <style>        ul li{            list-style: none;            float: left;            background:orangered;            padding:10px 20px;            background-image:url("../img/icon.png");            background-size:15px;            background-repeat: no-repeat;            /*left top*/            background-position: 5px 10px;        }        ul li a{            text-decoration:none;            color:white;            font-size:18px;            height:50px;        }    </style></head><body>    <ul>        <li><a href="#">天猫超市</a></li>        <li><a href="#">天猫国际</a></li>        <li><a href="#">天猫会员</a></li>        <li><a href="#">品牌街</a></li>        <li><a href="#">电器城</a></li>        <li><a href="#">喵生鲜</a></li>    </ul></body></html>

0 0