<html>
<head>
<title>css样式使用</title>
<meta charset="UTF-8"/>
<style type="text/css">
/*添加网页背景图*/
body{
background-image: url(img/1.jpg.jpg);/*添加背景图片*/
background-repeat: no-repeat;/*设置图片不重复*/
background-size: cover;/*设置图片平铺*/
}
/*设置table行高*/
tr{
height: 40px;
}
/*设置宽度*/
td{
width: 100px;/*设置宽*/
border-radius:10px;/*添加表框的角度*/
background: yellow;/*设置背景颜色*/*/
border: solid 1px blue;/*设置边框及其颜色和大小*/
text-align: center;/*设置文本位置*/
color: blue;/*设置文本颜色*/
font-weight: bold;/*设置文本加粗*/
letter-spacing: 10px;/*设置字体间距*/
}
ul{
background: gray;
height: 50px;
margin-top:10px ;
}
li{
list-style-type: none;/*去除li的标识符*/
/*display:inline*/
float: left;/*设置左悬浮菜单*/
}
li a{
color: black;
text-decoration: none;/*设置超链接去除下划线*/
font-weight: 10px;
font-size: 20px;
margin-left: 20px;
position: relative;
top: 10px;
}
</style>
</head>
<body>
<table >
<tr>
<td>姓名</td>
<td>性别</td>
<td>爱好</td>
</tr>
<tr>
<td>露娜</td>
<td>女</td>
<td>打野</td>
</tr>
<tr>
<td>张飞</td>
<td>男</td>
<td>辅助</td>
</tr>
</table>
<ul>
<li><a href="">首页</a></li>
<li><a href="">王者荣耀</a></li>
<li><a href="">吃鸡</a></li>
<li><a href="">LOL</a></li>
</ul>
</body>
</html>
展示效果: