line-height ~ text-align 文本居中与垂直居中

来源：互联网发布：java输出后buffered 编辑：程序博客网时间：2024/05/29 12:53

@{    Layout = null;}<!DOCTYPE html><html><head>    <meta name="viewport" content="width=device-width" />    <title>Index</title>    <script src="~/scripts/jquery-1.8.2.js"></script>    <style type="text/css">        #nav {            width: 450px;            height: 40px;            background-color: #808080;            margin: 0 auto;        }        ul {            list-style-type: none;            padding: 0px;        }        li {            width: 90px;            float: left;            line-height: 40px; /*垂直居中*/            text-align: center; /*文本居中*/        }        #nav ul li:hover /*--当鼠标聚焦到一级菜单下的li的时候将背景设为红色--*/ {            background-color: #ff0000;        }    </style></head><body>    <div>        <div id="nav">            <ul>                <li> 首页</li>                <li>课程大厅</li>                <li>学习大厅</li>                <li>金典案例</li>                <li>关于我们</li>            </ul>        </div>    </div></body></html>

0 0