前端基础-2day

前端基础

div和span标签

div 标签

没有具体的含义，用于划分页面区域，独占一行 快捷键：div={}*3

span标签

文本独立，需要修饰，独立修饰，由里面的内容决定宽度和高度，内容多宽，结果就多宽。

列表

有序列表

形式： 
<ol><li></li>
</ol>

有序列表的1,2，3…都是自动生成
《li》中间可以放任意标签，但是ol当中只能放li 标签

< ol>的属性

1. type= “1”；“a”;“A”;“i”;“I” 表示选择的排序的方式
2. start = “2”… 表示从那个开始哦排序

无序列表

 形式：  <ul> <li></li> </ul>

但是ul当中只能放li 标签
前面的符号默认为黑色的实心圆

《ul》的属性
type = “disc”（黑色实心圆） ；”cicle“（空心圆） ”square（正方形）“ ‘none（什么都没有，用的最多）’

自定义列表

自定义列表多用于图文混排的现象

 形式： <dl> <dt> 我是图片</dt>  <dd>  我是文字</dd> </dl>

图片

标签：img

形式： <img  src = ''>

图片标签的属性

1. src = "‘图片的路径
2. ’title =鼠标悬停在上面的提示信息
3. alt =图片不显示后的提示信息
4. width 宽度
5. height 高度
   注意：高度和宽度会等比例运算

超链接标签

标签：a

形式： <a href = '路径' title = ""> </a>

超链接标签的属性

1. href ：路径
2. title 鼠标悬停的提示
3. target 规定在新窗口还是当前窗口打开页面 新窗口（blank），默认是当前窗口打开页面

表格 table

标签：table

形式： 
< table>< tr>< td>< td>< /tr>
</table>

tr 表示的是行 ，td 表示的是列。
表格的属性

1. width 宽度
2. height 高度
3. border 边框
4. bgrdercolor 边框颜色
5. bgcolor 背景颜色
6. align 水平对齐
7. cellspacing 单元格与单元格之间的间距
8. cellpadding 单元格和内容之间的空隙

	tr 的属性	td的属性
height	行高	行高
bgcolor	背景颜色	背景颜色
align	文字对齐	文字对齐
valign	文字垂直对齐	文字垂直对齐

表格合并

1. colspan 所需要合并的单元格的列数
2. rowspan 所需要合并的单元格的行数

表单标签

形式：
<form menthod = '' action = ''>#框框
<input type = 'text'/>#按键
</form>

实例：

<form action="form_action.asp" method="get">First name: <input type="text" name="fname" />Last name: <input type="text" name="lname" /><input type="submit" value="Submit" />
</form>

表单控键属性

type

1. text 文本框
2. password 密码框
3. submit 提交框
4. button 按钮框
5. reset 重置框
   placeholder 输入前提示
   name 必须设置，否则不会发送给服务器
   value 校验