前端html随笔

浏览器调试工具：

Elements（页面元素）
使用元素面板可以自由的操作DOM和CSS来迭代布局和设计页面
Console（控制台）
在开发期间，可以使用控制台面板记录诊断信息，或者使用它作为 shell在页面上与JavaScript交互。
Sources（源代码）
在源代码面板中设置断点来调试 JavaScript，或者通过
Workspaces（工作区）连接本地文件来使用开发者工具的实时编辑器。
Network（网络）
使用网络面板了解请求和下载的资源文件并优化网页加载性能

html文档声明：

html5：<!DOCTYPE html>

常用标签

段落 <p></p>
强制换行<br/>
水平分割线<hr/>
img标签
主要属性
alt: 设置图像无法显示时可替代显示的文本
width：设置图像的宽度
height：设置图像的高度
border：设置图像边框粗细
hspace：设置图像与周围其他内容的水平间距
vspace：设置图像与周围其他内容的垂直间距
文件引用路径
相对路径
(1) 同一个目录的文件引用，即源文件和引用文件在同一个目录里，直接写引用文件名即可
(2) ../表示源文件所在目录的上一级目录
(3) ../../表示源文件所在目录的上上级目录，以此类推
(4)下级目录，直接写下级目录文件的路径即可
绝对路径
http://localhost;http://www.baidu.com
超链接
主要属性
href：设置链接的URL，相对路径或绝对路径
target: 显示链接的窗口或框架
_blank：在新窗口中打开链接
_self：在当前窗口打开链接
_parent：在父窗口中打开链接
_top：在顶级窗口中打开链接
framename：窗口名称
name：链接名称，创建文档内的书签
title：设置超链接的文字说明（鼠标悬停时显示）
无序列表<ul>
列表项用<li>……</li>标识
可选属性type：disc、square、circle分别表示用实心圆、正方形、空心圆作为列表符号
有序列表<ol>
列表项用<li>……</li>标识
可选属性type：1、a、A、i、I，分别表示用阿拉伯数字、小写英文字母、大写英文字母、小写罗马数字、大写罗马数字进行编号
div（块级元素，独占一行）
span(行内元素，前后文本显示在一行)
table 表格
caption 定义表格标题
thead 定义表格的页眉
tbody 定义表格的主题
tfoot 定义表格的页脚
tr 定义表格的行
th 定义表格的表头
td 定义表格的单元格
form表单
属性：action：表单提交地址，method：表单提交方式
后台对表单提取数据是通过name值获取
输入框input
input类型：
text：单行文本
password：密码框
file：文件输入框
hidden：隐藏域
checkbox：复选框
radio：单选框
button：按钮
reset：重置按钮
submit：提交按钮
多行文本框textarea
主要属性
name：多行文本框标识符
rows：文本域行数
cols：文本域列数
选择框，用……表示选择项
name：选择框标识
size：可见选项的个数
multiple：无取值，表示可以多选

value：选项值，将提交给后台
selected：无取值，表示初始选择项