li标签行内元素高度及居中

最新推荐文章于 2023-11-24 18:39:44 发布

weixin_30276935

最新推荐文章于 2023-11-24 18:39:44 发布

阅读量297

点赞数 1

原文链接：http://www.cnblogs.com/leee/p/5150361.html

版权

<head>
<title><title>
<style type="text/css">
        *
        {
            padding: 0px;
            margin: 0px;
        }
        li
        {
            list-style-type: none;
            width: 150px;
            float: left;
            line-height: 80px;/*行内元素不能设置高度，但可以设置行高*/
            text-align: center;/*让li内的内容水平居中，行内元素默认垂直居中*/
        }
        span
        {
            position: relative; /* li标签内的字体和图片中间对齐，让字体在原来位置top上移几个像素*/
            top: -5px;
            font-family: "宋体" , "微软雅黑" , "黑体";
            font-size: 14px;
            color: #000000;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <ul>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
        <li>
            <img src="../NewImgs/tu_48.png" /><span>耽误管理</span></li>
    </ul>
</body>
</html>