渗透工程师 HTML基础

1、简单的HTML页面架构

<!DOCTYPE html>
<html>
　　　　<head>
　　　　　　　　<meta charset="utf-8">(一般编码默认utf-8,也可以改bgk)
　　　　　　　　<title></title>

　　　　</head>
　　　　<body>
　　　　</body>
</html>

2、TML常见标签

meta标签

有利于网站seo(Search Engine Optimization搜索引擎优化)

meta name="keywords" content="1，2，3" />

<link> 标签

定义文档与外部资源的关系。 例：<link href="https://www.XXX.com">

<script>标签

这个标签的意思是脚本,运行于客户端,不在服务器端执行引入js文件

src属性的意思就是定义了一个锚点,也就是跳转页面,使页面跳转到你指定的地方去

注释

<p>标签
<p>这是一段普通的段落。</p>

标题标签
由大到小
<h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>6</h6>

</br> 换行标签

<hr> 换行线标签

文本属性

<b></b>加粗（也可以用<strong>加粗</strong>）
<i></i>斜体
<u></u> 下划线

<sup></sup>上标
<sub></sub>下标
<del></del> 删除线
<font></font> 规定字体属性
size 字体的大小
color 字体颜色

代码样式原样输出
<pre></pre>

form表单 规定当提交表单时向何处发送表单数据

method 提交的方法有 get（在浏览器上显示，不安全）：一般输入搜索信息时候用

　　　　　　　　　　post（不显示，安全）：一般输入账号密码之类的时候用

规定在发送表单数据之前如何对其进行编码。

enctype 属性可能的值
application/x-www-form-urlencoded
multipart/form-data
text/plain

input标签

name：同样是表示的该文本输入框名称。
size：输入框的长度大小。
maxlength：输入框中允许输入字符的最大数。
value：输入框中的默认值
readonly：表示该框中只能显示，不能添加修改。

input的类型

type=password 密码输入框

type=file 文件上传

type=hidden 隐藏域

button 按钮

选择框，复选框
checkbox 选择框

radio 多选框

type=submit 提交按钮
type=reset 重置按钮

a标签、img标签、table标签

a标签：控制界面与页面之间的跳转

默认就是self
self：用于在当前选项卡中跳转，也就是不新建页面跳转

_blank ：用于在新的选项卡中跳转，也就是新建页面跳转

锚文本（用于返回顶部之类的）
<a href="#2">锚点</a>
<a name="2">锚点</a>

img 元素向网页中嵌入一幅图像。

<img src="img/login_logo.png" alt="logo"/>

alt 规定图像的替代文本（图像不显示（即src=""时）需要显示的文字）

src 规定显示图像的url

width 规定图片的高度
height 规定图片的宽度

table 表格

border 边框
width 宽度
height 高度
colspan 行
rowspan 竖
<th></th>
<tr>行</tr>
<td>表格</td>
cellpadding 单元边与内容的空白
cellspacing 单元格的空白

列表标签

无序列表
项目符号 square circle disc

有序列表
数字列表默认数字
小写字母列表 a
大写字母列表 A
罗马字母列表 I
小写罗马字母列表 i

3、后台框架

一般整体布局为顶部，底部，菜单栏，主页面

常用标签：<frameset> <frame></frame> </frameset>

例：<frameset rows="20%,*">
　　　　<frame src="top.html" />
　　　　<frameset cols="30%,*">
　　　　　　<frame src="menu.html" />
　　　　　　<frame src="main.html" name="c" />
　　　　</frameset>
　　</frameset>

注：<li><a href="add_news.html" target="c">增加文章</a></li>

target中的目标要对应在index.html中修改，即可实现跳转

posted @ 2021-01-30 16:19 Letho 阅读(146) 评论(0) 收藏举报

刷新页面返回顶部

Letho

渗透工程师 HTML基础

公告