把学到的边框,阴影,内外边距做成导航条

原创 2018-11-26 23:38:56 135
摘要:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>PHP中文网</title><link rel="stylesheet" type="text/css" href="">&

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>PHP中文网</title>

<link rel="stylesheet" type="text/css" href="">

<link rel="shortcut icon" type="x-icon" href="shortcut icon.png">

<style>

*{margin:0px;padding: 0px}

.title-1 ul li{list-style: none;float:left;margin:10px;}

.title-1{height: 40px;width:800px;color: red;box-shadow: 5px;border:1px solid #ccc;margin:10px 400px;border-radius: 5px;box-shadow: 5px 2px 10px #888888;float: left;}

.title-1 a{text-decoration: none;color:red}

.title-1 a:hover{color:yellow;}

.title-1 ul li:hover{border-bottom: 2px solid red}


#title-2{background: red;width: 100px;height: 100px;border:1px solid #ccc;}

</style>

</head>

<body>

<div style margin 10px 1200px >

<div>

<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>

</ul>

</div>

<br>


</div>

</body>

</html>


批改老师:灭绝师太批改时间:2018-11-27 09:13:16
老师总结:可以学以致用才能达到学习的目的,完成的不错,继续加油!

发布手记

热门词条