什么是html?
它是超文本标记语言。
网页组成:
- 文档标记
<!DOCTYPE html>
- 头部标记
<head></head>
文档的编码方式
<meta charset="utf-8">
常用的标签:
<p>标签 | 段落标签 |
<img>图片标签行内标签 | width/height宽高 |
路径 | 绝对路径:https://xxxx 相对路径:ing/xx.jpg |
html注释 | 解释说明,增加可读性 |
<h1-h6> | 标题标签,块元素 |
<br> | 换行标签 |
网页图片类型 | 修饰图片:png、gif 内容图片:jpg |
颜色的组成 | red 红色 0-255 green 绿色 0-255 blue 蓝色 0-255 alpha 透明度 0-1 |
html常用标签:
ul>li | 无序列表 |
ol>li | 有序列表 |
dl>dt>dd | 定义列表 |
div | 块元素,支持宽高,自动换行,可以包裹任意标签 |
span | 行内元素,不支持宽高,不换行 |
marguee | 混动标签 |
pre | 预定义格式文本标签 |
<b>样式加粗 | <strong>样式加粗和强调 |
<i>样式倾斜 | <em>样式倾斜和强调 |
<sub>下标 | <sup>上标 |
<font color="red"> | 字体大小颜色 |
<hr width="" color=""> | 水平线 |
html的特殊符号 | < > |
超链接:
<a href="页面路径" target="空白窗口打开" ></a>
锚链接:
- 在标签内设置锚点:id="M_name"
- 跳转 在需要点击的标签内设置:<a href="#M_name"></a>
iframe框架:
<iframe src="页面路径" scrolling="yes/no" borderwidth="0/1" width="" height="">
frameset框架集:
- body和frameset不能同时使用
- <frameset rows="100px,10%"> <frame src="路径">
- <frameset cols="30%,*"> <frame src="路径">
<table>表格:
表格的属性:
width、height | 宽高 |
align | 对齐方式 |
border | 边框的宽度 |
background-color | 背景色 |
cellsapacing | 单元格间距 |
cellpadding | 单元格内部填充 |
rules单元格的边框显示 | rows cols all none |
frame表格的边框显示 | above below lhs rhs hsides vsides void |
行和单元格的属性
rowspan | 行合并 |
colspan | 列合并 |
width、height | 宽高 |
background-color | 背景色 |
align | 对齐方式 |
表单标签
- <form action="服务器地址" method="请求方法post/get">
表单域
单行文本 | <input type="text"> |
密码框 | <input type="password"> |
下拉列表 | <select><option> |
多行文本 | <textarea> |
单选按钮 | <input type="radio"> 单选按钮组的name统一,可实现单选 |
多选按钮 | <input type="checkbox"> |
文件选择 | <input type="file"> |
颜色选择 | <input type="color"> |
日期选择 | <input type="date"> |
数字、范围 | <input type="range"> |
表单域属性
placeholder | 提示文本 |
maxlength | 最大长度 |
required | 空白验证 |
checked | 默认勾选 |
表单按钮
提交按钮 | <input type="submit"> |
重置按钮 | <input type="reset"> |
自定义按钮 | <input type="button"> |