zoukankan html css js c++ java

简单的导航栏

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 　　<head>
 4 　　　　<meta charset="UTF-8">
 5 　　　　<title>导航栏</title>
 6 　　　　<style type="text/css">
 7 　　　　　　div{
 8 　　　　　　　　width: 830px;
 9 　　　　　　　　height: 60px;
10 　　　　　　　　background-image: url(bg.jpg);
11 　　　　　　}
12 　　　　　　ul{
13 　　　　　　　　/*取消列表前面的点*/
14 　　　　　　　　list-style: none;
15 　　　　　　}
16 　　　　　　li{
17 　　　　　　　　border: 1px solid red;
18 　　　　　　　　width: 100px;
19 　　　　　　　　height: 30px;
20 
21 　　　　　　　　background-color: rgb(244,232,247);
22 　　　　　　　　text-align: center;
23 　　　　　　　　/*设置行高,与自身高度一致也代表上下居中.*/
24 　　　　　　　　line-height: 30px;
25 　　　　　　　　/*字体加粗*/
26 　　　　　　　　font-weight: bold;
27 　　　　　　　　/*使标签横向排列*/
28 　　　　　　　　float: left;
29 　　　　　　　　color: rgb(255,48,183);
30 
31 　　　　　　　　/*是边框圆弧化 20px*/
32 　　　　　　　　border-radius: 20px;
33 　　　　　　　　/*设置阴影半径和阴影颜色 x轴偏移量 y轴偏移量 模糊度 半径 颜色*/
34 　　　　　　　　box-shadow: 0 0 5px 2px rgb(184,115,200);
35 
36 　　　　　　　　margin-top: 15px;
37 　　　　　　　　margin-left: 20px;
38 　　　　　　}
39 　　　　</style>
40 　　</head>
41 　　<body>
42 　　　　<div>
43 　　　　　　<ul>
44 　　　　　　　　<li>美妆护肤></li>
45 　　　　　　　　<li>时尚女装></li>
46 　　　　　　　　<li>品质家电></li>
47 　　　　　　　　<li>美颜滋补></li>
48 　　　　　　　　<li>京东生鲜></li>
49 　　　　　　　　<li>潮流电子></li>
50 　　　　　　</ul>
51 　　　　</div>
52 　　</body>
53 </html>

查看全文

相关阅读:
BZOJ 5308 [ZJOI2018] Day2T2 胖 | 二分 ST表
 CodeForces 464E The Classic Problem | 呆克斯歘主席树维护高精度
 BZOJ5298 [CQOI2018] 交错序列 | 矩阵乘法和一个trick
# BZOJ5300 [CQOI2018]九连环题解 | 高精度 FFT
[BZOJ5248] 2018九省联考 D1T1 一双木棋 | 博弈论状压DP
【2018九省联考】后的瞎扯
 BZOJ 4671 异或图 | 线性基容斥 DFS
Luogu 4294 [WC2008]游览计划 | 斯坦纳树
 BZOJ 2434 阿狸的打字机 | AC自动机
 UOJ#7. 【NOI2014】购票 | 线段树凸包优化DP

原文地址：https://www.cnblogs.com/zou-zou/p/8569589.html