百度360必应搜狗淘宝本站头条
HTML5 标签标签HTML5 标签 (已废弃)HTML 简介键盘快捷键
当前位置：网站首页 > 技术文章 > 正文

某教程学习笔记(一):04、HTML基础

zhezhongyun 2024-12-01 19:18 113 浏览

陪领导吃饭，把领导全部喝趴了。然后每个人都有人接回家，唯独我没有，当时走着去路边打车，被风一吹终于忍不住了，直到吐干净了，劲过去了，已经是凌晨四点了，摸摸手机，零条短信，零条来电，只有那棵树整整支撑了我五个小时。。。。

---- 网易云热评

一、概念

HTML是超文本标记语言，不是一种编程语言，标记语言是一套标记标签，使用标记标签来描述网页，HTML文档也叫做 web 页面


二、标签

标签通常被称为HTML标签，是由尖括号包围的关键词，比如 <html>，通常是成对出现的，比如 <b> 和 </b>，第一个标签是开始标签，第二个标签是结束标签


三、web浏览器

Web浏览器（谷歌浏览器，IE，Firefox）是用于读取HTML文件

1、我们新建一个html文件，用记事本打开，输入以下内容：

<html>

<head>

<title>hello word</title>

</head>

<body>

<h1>这里是标题</h1>

<p>这里是段落</p>

</body>

</html>

2、用web浏览器打开显示以下内容

3、右击网页，查看源代码，发现和我们写在记事本的呢日用一样

四、特殊字符

如果直接输入<>,就会报错，所以我们需要用特殊字符替代特殊符号

例如："<"、">"代表<>

代表空格

<h1>这里<是>标题</h1>

<p>这里是 段落</p>



五、标签介绍

<head>里面可以添加的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

例如：

<head>

<meta charset="utf-8"> <!--定义网页编码格式-->

<title>hello word</title>

</head>


<title>定义了浏览器工具栏的标题，当网页添加到收藏夹时，显示在收藏夹中的标题，显示在搜索引擎结果页面的标题

例如：<title>hello word</title>，收藏该网页的时候会自动命名Wiehello word


<body>定义文档的主体，包含文档的所有内容（比如文本、超链接、图像、表格和列表等等）

例如：

<body style="background-color:#8A2BE2;"> <!--网页背景颜色设置成紫色-->

<h1>这里是标题</h1>

<p>这里是段落</p>

</body>


<br> 换行标签


<pre> 文本通常会保留空格和换行符。而文本也会呈现为等宽字体


<a>标签定义超链接，用于从一个页面链接到另一个页面，元素最重要的属性是 href 属性

例如：<a href="https://www.baidu.com/">百度</a>，点击百度就会跳转到百度网站


<ul>无序列表

<ul>

<li>好好学习</li>

<li>天天向上</li>

<li>好好学习</li>

<li>天天向上</li>

</ul>



<ol>有序列表

<ol>

<li>好好学习</li>

<li>天天向上</li>

<li>好好学习</li>

<li>天天向上</li>

</ol>


<hn>标题标签，一共6级

<h1>好好学习</h1>

<h2>天天向上</h2>

<h3>好好学习</h3>

<h4>天天向上</h4>


<form>表单标签

<form>

name:

<input type="text" name="name">

pass:

<input type="text" name="pass"></br>

<input type="submit" name="提交">

</form>


禁止非法，后果自负
欢迎关注公众号：web安全工具库

相关推荐

perl基础——循环控制_principle循环

在编程中，我们往往需要进行不同情况的判断，选择，重复操作。这些时候我们需要对简单语句来添加循环控制变量或者命令。if/unless我们需要在满足特定条件下再执行的语句，可以通过if/unle...

CHAPTER 2 The Antechamber of M de Treville 第二章 特雷维尔先生的前厅

CHAPTER1TheThreePresentsofD'ArtagnantheElderCHAPTER2TheAntechamber...

CHAPTER 5 The King&#39;S Musketeers and the Cardinal&#39;S Guards 第五章 国王的火枪手和红衣主教的卫士

CHAPTER3TheAudienceCHAPTER5TheKing'SMusketeersandtheCardinal'SGuard...

CHAPTER 3 The Audience 第三章 接见

CHAPTER3TheAudienceCHAPTER3TheAudience第三章接见M.DeTrévillewasatt...

别搞印象流!数据说明谁才是外线防守第一人!

来源：Reddit译者：@assholeeric编辑：伯伦WhoarethebestperimeterdefendersintheNBA?Here'sagraphofStea...

V-Day commemorations prove anti-China claims hollow

People'sLiberationArmyhonorguardstakepartinthemilitaryparademarkingthe80thanniversary...

EasyPoi使用_easypoi api

EasyPoi的主要特点：1.设计精巧,使用简单2.接口丰富,扩展简单3.默认值多,writelessdomore4.springmvc支持,web导出可以简单明了使用1.easypoi...

关于Oracle数据库12c 新特性总结_oracle数据库12514

概述今天主要简单介绍一下Oracle12c的一些新特性，仅供参考。参考：http://docs.oracle.com/database/121/NEWFT/chapter12102.htm#NEWFT...

【开发者成长】JAVA 线上故障排查完整套路!

线上故障主要会包括CPU、磁盘、内存以及网络问题，而大多数故障可能会包含不止一个层面的问题，所以进行排查时候尽量四个方面依次排查一遍。同时例如jstack、jmap等工具也是不囿于一个方面的问题...

使用 Python 向多个地址发送电子邮件

在本文中，我们将演示如何使用Python编程语言向使用不同电子邮件地址的不同收件人发送电子邮件。具体来说，我们将向许多不同的人发送电子邮件。使用Python向多个地址发送电子邮件Python...

提高工作效率的--Linux常用命令，能够决解95%以上的问题

点击上方关注，第一时间接受干货转发，点赞，收藏，不如一次关注评论区第一条注意查看回复：Linux命令获取linux常用命令大全pdf+Linux命令行大全pdf为什么要学习Linux命令？1、因为Li...

linux常用系统命令_linux操作系统常用命令

系统信息arch显示机器的处理器架构dmidecode-q显示硬件系统部件-(SMBIOS/DMI)hdparm-i/dev/hda罗列一个磁盘的架构特性hdparm-tT/dev/s...

小白入门必知必会-PostgreSQL-15.2源码编译安装

一PostgreSQL编译安装1.1下载源码包在PostgreSQL官方主页https://www.postgresql.org/ftp/source/下载区选择所需格式的源码包下载。cd/we...

Linux操作系统之常用命令_linux系统常用命令详解

Linux操作系统一、常用命令1．系统(1)系统信息arch显示机器的处理器架构uname-m显示机器的处理器架构uname-r显示正在使用的内核版本dmidecode-q显示硬件系...

linux网络命名空间简介_linux 网络相关命令

此篇会以例子的方式介绍下linux网络命名空间。此例中会创建两个networknamespace：nsa、nsb，一个网桥bridge0，nsa、nsb中添加网络设备veth，网络设备间...

一周热门
最近发表
标签列表