什么是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 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>表格:
<tr> 行
<th><td> 单元格
<tr> | 行 |
<th> <td> | 单元格 |
表格的属性:
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"> | 单选按钮 |
<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"> | 自定义按 |
纯洁的冬天悄然流逝,多变的永远是天气,不变的永远是心情!愿淡淡的寒气轻拂您一生的疲惫,飒飒的北风传递我衷心的祝福:冬天里,注意添衣保暖,开心每一天!