HTML表格
1.表格的定义
//字母 td 指表格数据(table data)
//即数据单元格的内容。
//数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
//可以用<th>来定义表头,
//使用<caption>表示表格标题。
2.使用colSpan和rowspan
使用colSpan属性设置单元格要跨越的表格列数。rowspan设置单元格要跨越表格的多少行。例如:
<table border="1">
<caption>跨行跨列的表格</caption>
<tr>
<th>姓名</th>
<th colspan="2">电话号码</th><!-- 跨列 -->
</tr>
<tr>
<td rowspan="2">李志伟</td><!-- 跨行 -->
<td>123123</td>
<td>123123</td>
</tr>
<tr>
<td>123123</td>
<td>123123</td>
</tr>
</table>
3.cellpadding属性设置边距
<table border="1" cellpadding="30">
<tr>
<td>First</td>
<td>Row</td>
</tr>
</table>
4.cellspacing属性设置单元格间距
<table border="1" cellspacing="10">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
5.background属性
background设置背景色或背景图片
6.align属性设置对齐方式
<th align="left">总计</th>
7.frame属性
设置表格周围的边框显示的方式。
8.表格标签
<table> //定义表格
<caption>//定义表格标题。
<th>//定义表格的表头。
<tr>//定义表格的行。
<thead>//定义表格的页眉。
<tbody>//定义表格的主体。
<tfoot>//定义表格的页脚。
<col>//定义用于表格列的属性。
<colgroup>//定义表格列的组。
HTML 列表
(1)定义列表的标签
//<ol> 定义有序列表。 <ul> 定义无序列表。
//<li> 定义列表项。 <dl> 定义定义列表。
//<dt> 定义定义项目。 <dd> 定义定义的描述。
(2)无序列表
<ul type="disc">
<li>第一个</li>
<li>第二个</li>
</ul>
(3)有序列表
<ol>
<li>第一个</li>
<li>第二个</li>
</ol>
(4)自定义列表
<dl>
<dt>第一</dt>
<dd>第一条数据</dd>
<dt>第二</dt>
<dd>第二条数据</dd>
</dl>
(5)type属性
设置列表的样式。
HTML表单和输入
(1)各种表单标签
//<form> 定义供用户输入的表单 <input> 定义输入域
//<textarea> 定义文本域 (一个多行的输入控件) <label> 定义一个控制的标签
//<fieldset> 定义域 <legend> 定义域的标题
//<select> 定义一个选择列表 <optgroup> 定义选项组
//<option> 定义下拉列表中的选项 <button> 定义一个按钮
(2)包含各种表单元素的示例
<fieldset>
<legend>表单元素:</legend>
<form>
自行车: <input type="checkbox" name="Bike"><br/>
汽车: <input type="checkbox" name="Car" checked="checked"><br/>
男性: <input type="radio" checked="checked" name="Sex" value="male"/><br/>
女性: <input type="radio" name="Sex" value="female"/><br/>
<select name="cars">
<option value="volvo">111</option>
<option value="saab">222</option>
<option value="fiat" selected="selected">333</option>
<option value="audi">444</option>
</select><br/>
<textarea rows="10" cols="30">文本域</textarea><br/>
<input type="button" value="按钮"><br/>
<input type="submit" value="提交" /><br/>
<input type="reset" value="还原" /><br/>
</form>
</fieldset>
HTML颜色
(1)HTML颜色名
大多数的浏览器都支持颜色名集合。仅仅有 16 种颜色名被 W3C 的 HTML4.0 标准所支持。它们是:aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow。
(2)HTML颜色值
颜色由一个十六进制符号来定义,这个符号由红色、绿色和蓝色的值组成(RGB)。每种颜色的最小值是 0(十六进制:#00)。最大值是 255(十六进制:#FF)。例如:RGB(255,255,255)或#FFFFFF表示白色。
CSS 基础语法
1.层叠次序
一般而言,所有的样式会根据下面的优先级层叠于一个新的虚拟样式表中:
1.浏览器缺省设置
2.外部样式表
3.内部样式表(位于 标签内部)
4.内联样式(在 HTML 元素内部)
因此,内联样式(在 HTML 元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明:
下面这行代码的作用是将 h1 元素内的文字颜色定义为红色,同时将字体大小设置为 14 像素。在这个例子中,h1 是选择器,color 和 font-size 是属性,red 和 14px 是值。
h1 {color:red; font-size:14px;}lector {property: value}
Css联级样表
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>No--Title</title>
<style type="text/css">
h2{color:red;font-size:15px;}
#h2{color:red;font-size:15px;} id样式
.h2{color:red;font-size:15px;} 类样式
</style>
</head>
Head头里添加黑体信息,h2标签内的内容均为style里的样式
CSS Cascading Style Sheets层叠式样表
字体样式的定义规则
font-family
font-size
font-weight
font-style
font-height
line-height 行高,单位px
text-align 水平对齐方式(center,left,right,justify)
Color 可以为英文,也可以为#xxx或者#xxxxxx(十六进制)
网页字体大小通常为12和14px,可以设置的css样式(body{font-size:12px;}即可,body是标签选择器