零基础学安全--HTML

学习连接

HTML简介

HTML基本结构

例子

表单标签

表格标签

超链接标签

学习连接

声明！

学习视频来自B站up主 **泷羽sec** 有兴趣的师傅可以关注一下，如涉及侵权马上删除文章，笔记只是方便各位师傅的学习和探讨，文章所提到的网站以及内容，只做学习交流，其他均与本人以及泷羽sec团队无关，切勿触碰法律底线，否则后果自负！！！！有兴趣的小伙伴可以点击下面连接进入b站主页[B站泷羽sec]

泷羽-SEC

HTML简介

是用于创建网页和网页应用的标准标记语言。它使用一系列标签（tags）来描述网页的内容和结构。

HTML基本结构

html 复制代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文档标题</title>
</head>
<body>
    <h1>这是一个标题</h1>
    <p>这是一个段落。</p>
</body>
</html>

将后缀改为.html用浏览器打开即可显示你编辑的内容

<!DOCTYPE html>: 声明文档类型，告诉浏览器这是一个HTML5文档

<html lang="zh-CN">: <html>标签定义整个HTML文档，lang属性指定文档的语言

<head>: 包含文档的元数据（metadata），如字符集、页面标题、外部链接的CSS和JavaScript文件等，这个里面的东西一般不是类似于文字直接显示的东西，而是例如元素位置，背景等不直接显示的东西

<title>: 定义文档的标题，在浏览器标签栏中显示

<meta name="viewport" content="width=device-width, initial-scale=1.0">: 用于提供多种类型的元数据，确保网页在移动设备上良好显示，例如编码的设置、页面的描述。

<link>:这个标签用于连接外部连接比如说一些css样式

<script> 标签在 HTML 中用于定义客户端脚本，比如 JavaScript。这些脚本可以用于生成动态页面内容、控制多媒体、动画以及处理用户输入等

<body>: 包含网页的可见内容，如文本、图片、链接等

<p>:用于定义段落

<a href="URL">，用于创建超链接，href属性指定链接目标地址，点击就可以到达目标内容

<table>：定义表格。

<tr>：定义表格行。

<td>：定义表格单元格。

<th>：定义表头单元格。

<form>：定义表单。

<input>：定义输入控件，如文本框、按钮等。

<textarea>：定义多行文本输入控件。

<select>和<option>：定义下拉列表。

标签不止这么点，感兴趣的小伙伴可以学习一下

例子

表单标签

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签</title>
</head>
<body>

     <form action="https://www.baidu.com" method="post">
        username:<input type="text" name="username" >
        password:<input type="password" name="password">
        <!-- 提交按钮后 -->
        <button type="submit">提交</button>
     </form>
        
</body>
</html>

表格标签

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格标签</title>
</head>
<body>
     <table border="1px">
        
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
            <th>薪水</th>
        </tr>
        <tr>
            <td>测试内容</td>
            <td>测试内容</td>
            <td>测试内容</td>
            <td>测试内容</td>
        </tr>
        <tr>
            <td>测试内容</td>
            <td>测试内容</td>
            <td>测试内容</td>
            <td>测试内容</td>
        </tr>
     </table>
</body>
</html>

超链接标签

html 复制代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>超链接</title>
</head>
<body>
    <a href="https://www.baidu.com" title="百度" target="_blank">百度一下，我就知道</a>
</body>
</html>