五大浏览器
chrome 谷歌
firefox 火狐
ie
opera 欧朋
safari 苹果
html是什么?
HyperText Markup Language 超文本标记语言,在浏览器里运行
标记标签
双标记标签
<标签名>内容</标签名>
单标记标签
<标签名>
html文档基本结构
<!DOCTYPE html>
<html>
<head>
<title>网页标题</title>
<meta charset="utf-8">
</head>
<body></body>
</html>
段落标签
<p>内容</p>
块元素内不可再加块元素
图片标签
<img src="路径“ alt="加载失败” width="宽度“ height="高度" title="鼠标挪到图片所显示文本">
src 图片引入路径
1.当html文件 与 图片 在同一个目录下,
src="./1.jpg"
2.当html文件 与 图片所在文件夹 在同一个目录下,src="./文件夹/2.jpg"
3.当html文件所在文件夹 与 图片在同一个目录下,
src=".当前所在文件夹.图片所在文件夹/3.jpg"
4.当html文件所在文件夹 与 图片所在文件夹 在同一目录下, src="../img/4.jpg"
alt 当图片加载失败时,用来替代图片的文本
width 宽度
height 高度
title 鼠标放到标签上的提醒文本
标题标签
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h1>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
换行<br> 常用于段落内部换行
水平线
<hr width=" align=“” color="">
width 宽度
align 水平方向的对齐方式
center 水平居中对齐
left 居左对齐
right 居右对齐
color 修改水平线颜色
列表
无序列表
<ul>
<li>列表项</li>
<li>列表项 </li>
</ul>
有序列表
<ol>
<li>列表</li>
<li>列表</li>
</ol>
行内元素
加粗
<b>内容</b>
<strong>内容</strong>强调
倾斜
<i>内容</i>
<em>内容</em>
强调
上下标
上标
<sup>内容</sup>
下标
<sub>内容</sub>
小号字体
<samll>内容</samll>
超链接
<a href="" target=""> 超链接</a>
href 引入跳转页面的路径
1.网址
2.相对路径
3.锚链接
#id值
target=“_blank” 在新窗口中打开链接
行内框架
<iframe src="“ fiameborder="0"></iframe>
src 引入页面的地址
fiameborder 边框
表格
基本结构
<table>
<tr>
<th> 表格标题</th>
<td>单元格</td>
</tr>
</table>
table的属性
border 边框
cellspacing 单元格与单元格之间的距离
cellpadding 内容与单元格间距离
bordercolor 边框颜色
bgcolor 背景颜色
align 水平方向对齐
left 左
center 中
right 右
rules 规定内测边框是否可见
none 无边框
rows 位于行内侧边框
cols 位于列内侧边框可见
all 位于行与列内侧边框均可见
表单
表示采集数据范围
<from action=" method=">
</from>
actiom 数据提交的地址
method 数据提交的方式
get
post
<input type="" name="" value=""
placeholder="" maxlength="">
type类型
text
<input type=""> 文本输入框
password
<input type="password">密码框
submit
<input type="submit" value="提交">提交按钮
reset
<input type="reset" value="重置">重置按钮
button
<input type="button" value=“按钮”>一般按钮
image
<input type="image" src="图片路径" alt="">
图片按钮
checkbox
<input type="checkbox">复选框
radio
<input type="radio">单选框
file
<input type="file"> 文件上传框
name 名称
value 初始值
placeholder 输入框里的提醒文本
maxlenqth 输入框里的字符个数的限制
文本域
<textarea name="" id="" cols="30" rows="10"></textarea> 文本域
下拉选择框
<select name="" id="">
<option value="值"></option>
<option value="值" selecter>选项</option>
</select>
给option添加selected 可以默认选中
按钮
<button>按钮</button>
<button type="submit">提交按钮</button>
<button type="reset">重置按钮</button>
元素分类
块元素
<p>...</p> 段落
<ul>...</ul> 无序列表
<ol>...</ol> 有序列表
<form></form>
<hr>
<div>...</div>
行内元素
display:inline
<span>...</span>
<br> 换行
<b>...</b> 加粗
<strong>...</strong> 加粗
<img > 图片
<sup>...</sup> 上标
<sub>...</sub> 下标
<i>...</i> 斜体
<em>...</em> 斜体
<u>...</u> 下划线
<a href="">,</a>
<label></label>
<small></small>
行内块元素
display: inline-block
<img > 图片
<iframe src=""></iframe>
<input type="">
<textarea></textarea>
<select></select>
<button></button>