CTF-前端基础 html
1.html基本元素
<!DOCTYPE html> <!-- html5标准网页声明-->
<html></html> <!-- 限定了文档的开始点和结束点-->
<head></head> <!-- 头部元素的容器-->
<meta charset=""/> <!-- 规定HTML文档的字符编码-->
<title></title> <!-- 网页的标题-->
<body></body> <!-- 定义文档的主体-->
<div></div> <!-- 区隔标记,块元素-->
示例:
2.文本元素
<p></p> <!-- 独占一行-->
<b></b> <!-- 加粗显示-->
<i></i> <!-- 斜体-->
<u></u> <!-- 下划线-->
<br> <!-- 换行-->
<hr> <!-- 一条横线-->
<a href="" target=""></a> <!-- 超链接-->
注意:a元素中的href属性值为目标网页地址,target属性为打开目标网页的方式。(_self为刷新本页面打开,_blank为在新页面中打开)
示例:
3.表格元素
<table border="1" cellspacing="1" cellpadding="1"> <!-- 创建表格-->
<tr></tr> <!-- 表中一行-->
<th></th> <!-- 表头-->
<td></td> <!-- 表中的一个单元格-->
注意:th和td标签中有colspan属性和rowspan分别可以合并单元格的行和列。
示例:
4.序列元素
<ol type="A"></ol> <!-- 定义有序列表-->
<ol reversed></ol> <!-- 定义逆序列表-->
<ul></ul> <!-- 定义无序列表-->
<li></li> <!-- 列表元素-->
注意:ol元素的type属性的值为有序列表元素的序号,通常取‘A’、‘a’、‘1’,ol元素的reversed属性表示逆序,不需要属性值。列表可以嵌套使用。
示例:
5.表单元素
<form action="" method=""></form> <!-- 定义表单-->
<input type="text" placeholder="name" maxlength="8"> <!-- 可输入文本框-->
<input type="text" value="123456" readonly="readonly"/> <!-- 只读文本框-
<input type="password"/></td> <!-- 密码文本框-->
<textarea rows="8" cols="36"></textarea> <!-- 多行文本框-->
<input type="button" name="" id="" value="按钮" /> <!-- 普通按钮-->
<input type="submit" name="" id="" value="提交" /> <!-- 提交按钮-->
<input type="range" min="-100" max="100" step="10"/> <!-- 滑动条 -->
<input type="number" min="-100" max="100" value="0"/> <!-- 数字框-->
<input type="radio" name="a" id="" value="1" /> <!-- 单选-->
<input type="checkbox" name="1" id="" value="1" /> <!-- 多选-->
<select>
<option value ="1"></option> <!-- 选项列表-->
</select>
注意:input元素的value属性的字符占位,而placeholder属性不占位;maxlength属性是文本框可输入的最大长度,size属性是文本框的长度;
示例: