首页 > 代码库 > 20161111
20161111
学习了一些个字体标签，表格的制作和背景的各种样式。
笔记：
了解一下：
菜鸟网：runoob.com
<b></b>加粗 <i></i>斜体 <sup></sup>上标 <sub></sub>下标 <del></del>删除字 <pre></pre>预定义 <var></var>定义变量
<samp></samp>定义计算机代码样本 <abbr title=""></abbr>定义缩写
<address></address>地址，针对搜索引擎 <bdo dir="rtl"></bdo>定义方向rtl:right to left <q></q>定义短的引用语
制作表格：
<table></table>
<tr></tr>设置行，to right
<td></td>设置列，to down
<caption></caption>设置表的名字
colspan 设置占几列
空格表示的，包含关系。逗号表示并列
background-image:url() 背景图片
background-size:调整背景图片大小
实现：
表格制作
<!DOCTYPE html>
<html>
<head>
<title>表格制作</title>
<style>
table{
text-align: center;
border:10px outset #ffff00;
/*background-color: green;*/
background-image: url(../1.jpg);
}
</style>
</head>
<body>
<table width="300px" height="300px" border="1px">
<caption>表</caption><!-- 表的名字 -->
<thead>
<tr><!-- 设置行，tr可以理解为to right -->
<th>lalala</th><!-- th表示表头，head -->
<td>lalala</td><!-- 设置列，td可以理解为to down-->
</tr>
</thead>
<tbody>
<tr>
<td>lslslsls</td>
<td>lslslsl</td>
<td>lslslsl</td>
</tr>
<tr>
<td colspan="3">lslslsls</td><!-- colspan设置占几列 -->
</tr>
<tr>
<td rowspan="2">lslslsls</td><!--rowspan设置占几行 -->
<td>lslslsl</td>
<td>lslslsl</td>
</tr>
</tbody>
</table>
</body>
</html>
2.背景的设置
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
div{
background-image: url(../1.jpg);
border:2px blue;
background-repeat:no-repeat;/*repea-y是y轴重复，no-repeat就是不重复，repeat-x是x轴重复，默认是repeat*/
width: 1000px;
height: 1000px;
background-size: 1000px 1000px;/*调整背景图片大小*/
background-position: 100px 200px;/*调整背景图片位置，前面为横向移动距离，后面为纵向移动距离，了两个数值都可以是负值*/
}
</style>
</head>
<body>
<div>试试试</div>
</body>
</html>
20161111