HTML知识
标签：文件名 密码字段 idt text 段落 cells 目录文件 图像 大小
简介
结构用于对网页元素进行整理和分类，身体，HTML。
表现用于设置网页元素的板式、颜色、大小等外观样式，装饰CSS。
行为是指网页模型的定义及交互的编写，动作，JavaScript。
结构标签(骨架标签)
每个网页都有一个基本的结构标签
HTML标签
<html></html>
根标签，所有html语言都在其内部
网页头部
<head></head>
在头部中一定要设置标题
title网页标题
<title></title>
当前网页的名字
网页主体
<body></body>
页面中的内容都在主体中
范例
<!DOCTYPE html> <html> <head> <title>网页标题</title> </head> <body> 页面内容 </body> </html>
<!DOCTYPE>
文档类型声明标签
告诉浏览器使用哪个版本的
HTML来显示网页使用
HTML5版本来显示网页<!DOCTYPE html>
lang
定义当前文档显示的语言
若需要使用浏览器翻译当前网页，则需要用到
en为英语zh-CN为中文
<html>
charset
规定
HTML文档使用的字符编码UTF-8为万国码，基本包含了所有国家的字符
若不设置编码格式，可能会出现乱码
写在
title标签中
<title> <meta charset="UTF-8"> </title>
标题标签
共有6级，
h1~h6一个标题单独占一行
<h1>1</h1> <h2>2</h2> ···
段落标签
将文字分段
段落之间有间距
<p>一个段落<p>
换行标签
换行
<br />
加粗标签
将文字加粗
<strong>加粗</strong> <b>加粗</b>
倾斜标签
将文字倾斜
<em>倾斜</em> <i>倾斜</i>
删除线标签
文字中间有一条线
<del>删除线</del> <s>删除线</s>
下划线标签
文字下面有一条线
<ins>下划线</ins> <u>下划线</u>
盒子标签
div<div>大盒子</div>
独占一行，一行只能有一个
div大盒子
span<span>小盒子</span>
一行可以有多个
span小盒子
图像标签
用来设置
HTML页面中的图像属性
图像边框的粗细
边框一般通过CSS进行修改
图像的高度
高度和宽度只需要设置一个即可，另一个会根据比例进行缩放
图像的宽度
鼠标放到图片上时，显示的文字
若图像不能显示时，显示的文字
用于指定图像文件的路径和文件名
是图像标签必须添加的属性
srcalttitlewidthheightborder范例
<img src="./image/1.jpg" alt="替换文本" title="提示文本" width="250" height="250" border="3" />
路径
目录文件夹
就是存放所有文件的最外面那个文件夹，即项目文件夹
根目录
打开目录文件夹的第一层就是根目录
绝对路径
D:\image\a.jpghttps://www.phd99.com/images/a.jpg相对路径
../imageimage/a.jpg或者
./image/a.jpg当前文件夹中的image文件夹下的a图片
当前文件夹的上一级文件夹中的image文件夹
超链接标签
从一个页面跳转到另一个页面
属性
<a href="https://www.phd99.com" target="_parent">新页面</a>
_self在当前窗口打开，默认_blank在新窗口中打开当值为
#时，为空链接herf指定要跳转的页面的url地址target指定如何打开跳转页面范例
锚点链接
<a href="#phd">跳转到id属性值为phd的标签处</a>
点击时可以直接定位到页面中的某个位置
注释标签
快捷键
ctrl + /
<!-- 这是一个注释 -->
特殊字符
空格
大于
<
小于
>
和
&
人民币
¥
版权
©
注册商标
®
摄氏度
°
正负号
±
乘号
×
除号
÷
平方
²
立方
³
表格标签
table用于定义表格tr用于定义一行td用于定义一行中的一列th表头单元格，里面的单元格会加粗居中显示，一般用于表格的第一行属性
align，对齐方式border，设置表格是否有边框cellpadding，文字和单元格边框之间的距离cellspacing，单元格之间的距离width，表格的宽度
<table border="1" width="200" cellpadding="1" cellspacing="1"> <tr> <th>第1行第1列</th> <th>第1行第2列</th> </tr> <tr> <td>第2行第1列</td> <td>第2行第2列</td> </tr> </table>
表格头部标签
<thead>表头区域，表头部分
表格主题标签
<tbody>主体区域，表格的内容部分
<table border="1" width="200" cellpadding="1" cellspacing="1"> <thead> <tr> <th>第1行第1列</th> <th>第1行第2列</th> </tr> </thead> <tbody> <tr> <td>第2行第1列</td> <td>第2行第2列</td> </tr> </tbody> </table>
列表标签
无序列表
无顺序
用
<ul>表示无序列表，<ul>标签中只能有<li>标签用
<li>表示列表中的一项，<li>标签中放其他标签
<ul> <li>啊啊</li> <li>嗯嗯</li> <li>嘿嘿</li> </ul>
有序列表
有顺序
用
<ol>表示有序列表，<ol>标签中只能有<li>标签用
<li>表示列表中的一项
<ol> <li>张三</li> <li>李四</li> <li>王五</li> </ol>
自定义列表
对列表中的信息有一个整体的描述
用
<dl>表示自定义列表，<dl>标签中只能有<dt>和<dd>标签用
<dt>表示最上面的描述标题用
<dd>表示描述标题下面的每一个小标题
<dl> <dt>服务支持</dt> <dd>售后政策</dd> <dd>自助服务</dd> <dd>相关下载</dd> </dl>
表单标签
表单域
<form>属性
action用于指定接收并处理表单数据的服务器程序的url地址method用于设置表单数据的提交方式，其取值为get或postname用于指定表单的名称，以区分同一个页面中的不同表单域
表单元素
input
输入表单元素
type属性值button按钮checkbox复选框，要有相同的name属性值file定义输入字段和“浏览”按钮，供文件上传hidden定义隐藏的输入字段image定义图像形式的提交按钮password定义密码字段radio定义单选按钮,要有相同的name属性值reset定义重置按钮，会清除表单中的所有数据submit定义提交按钮，提交按钮会把表单数据发送到服务器text定义单行的输入字段，用户可在其中输入文本，默认宽度为20个字符checked属性值单选按钮和复选框可以设置checked属性，当页面打开的时候可以默认选中这个按钮
checked="checked"maxlength属性值规定输入字段中的字符的最大长度
<form action="test.php" method="post" name="1"> <input type="text" maxlength="10"><br> 男<input type="radio" name="sex" value="男" checked="checked"> 女<input type="radio" name="sex" value="女"> </form>
select
下拉表单元素
<option>标签用来表示下拉列表中的选项selected属性设置默认选择
<form> <select> <option>学生</option> <option>警察</option> <option>医生</option> <option selected="selected">教师</option> </select> </form>
textarea
文本域元素
可以输入多行文字
常见于留言板、评论
属性
cols一行显示的字符数rows显示的行数
<form> <textarea cols="10" rows="2"> 内容 </textarea> </form>
标注标签
<label>当点击label标签对应的位置时，其完成的功能就是与for属性值相同的id属性值对应的其他标签所完成的功能。
鼠标点击“男”的位置，也能实现单选功能
<form action="test.php" method="post" name="1"> <label for="nan">男</label> <input id="nan" type="radio" name="sex" value="男" checked="checked"> <label for="nu">女</label> <input id="nu" type="radio" name="sex" value="女"> </form>
标签：文件名 密码字段 idt text 段落 cells 目录文件 图像 大小
原文地址：https://www.cnblogs.com/phd99/p/14408284.html