HTML笔记整理

最新推荐文章于 2022-03-08 08:04:56 发布

Zhu Xiaopi

最新推荐文章于 2022-03-08 08:04:56 发布

阅读量813

点赞数 4

文章标签： html html5

本文链接：https://blog.csdn.net/qq_46063425/article/details/118092521

版权

HTML笔记整理

自学前端快一年了，现在感觉学的东西好多、好杂、好乱，知识不成体系，所以下定了决心花一点时间来整理一下学过的前端知识，帮助自己记忆的同时，也希望可以帮助到更多学习前端的小伙伴。这是我整理的第一篇——HTML笔记

一、认识HTML

1、html的发展史

1993年（IETF）HTML 1.0

1995年（W3C） HTML 2.0

1996年（W3C） HTML 3.2

1997年（W3C） HTML 4.0

1999年（W3C） HTML 4.01

2000年（W3C） XHTML 1.0

2001年（W3C） XHTML 3.2

XHML2.0？

2004 年（WHATWG）HTML5草案

2008年（合并）HTML5正式版

HTML5未来

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-iLgO2KMX-1624272433591)(C:\Users\cian\AppData\Roaming\Typora\typora-user-images\image-20210621095539740.png)]$

2.html （英文：Hyper Text Markup Language）超文本标记语言

说白了HTML就是用尖括号抱起来的的英文单词，浏览器对这个尖括号包裹起来的英文单词有特殊的解释

超文本：在文本文件里面除了基本文本之外HIA包含图片，音频，视频的内容

标记：特殊符号作为的一个标记

3、作用

当然是用来编写网页啦~

4、在网页中如何查看网页代码

右键---->检查

5、HTML的基本结构

<html>
	<head>
		<title>网页的标题</title>
	</head>
	<body>
	这里写内容
	</body>
</html>

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-O6ZCVyuG-1624272433596)(C:\Users\cian\AppData\Roaming\Typora\typora-user-images\image-20210620202857849.png)]$

5、html中的注释 Ctrl+/

<!-- 这里写注释内容 -->

二、HTML中标签

1、标题 h1,h2,h3,h4,h5,h6 （字号从大到小）

特点：

文字加粗

独占一行

<html>
	<head>
		<title>网页的标题</title>
	</head>
	<body>
	<h1>h1</h1>
	<h2>h2</h2>
	<h3>h3</h3>
	<h4>h4</h4>
	<h5>h5</h5>
	<h6>h6</h6>
	</body>
</html>

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-cqYUUEQ4-1624272433598)(C:\Users\cian\AppData\Roaming\Typora\typora-user-images\image-20210620203510697.png)]$

2、段落标签 p

<p>这里写段落内容</p>

3、换行标签

<p>第一行</br>第二行</p>

4、字体标签

加粗 </stong>

下划线标签 <ins></ins>

倾斜标签：em

5、pre预排版标签

使用其他的标签在标签内有空格，浏览器会默认将空格清除

使用pre浏览器就不会将空格清除掉

<pre>
	****
  ********
  **    **
  	****
</pre>

6、分隔标签 <hr>

三、标签的属性

1、标签的分类

双标签：
单标签：

2、属性

每一个标签都有它的属性（特征）
一个标签有一个或多个属性
每一个属性都有对应的值，值要有引号引起来（单引号双引号都可以）
属性之间用空格隔开
属性没有顺序

<h1 name='h' class="h" id="h"></h1>

注意：这里的name，class ，id是属性其对应的字符串是属性值

四、列表

1、 ul li 无序列表

ul中有一个属性 type 可以改变列表前的标记

type=‘circle’ 圆 //square方块

	<body>
	<ul>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
	</ul>
	</body>

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1njc17rn-1624272433601)(C:\Users\cian\AppData\Roaming\Typora\typora-user-images\image-20210620210308856.png)]$

2、ol li 有序列表

但type = ’A’ 列表的开头标记以 ABC…排序

type = ’1’ 列表的开头标记以 123…排序

属性 start 使用来控制从什么开始（必须是数字）

start =2 ，从2开始

	<body>
	<ol type='1'>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
		<li>hhhh</li>
	</ol>
	</body>

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-rgzLeRBt-1624272433603)(C:\Users\cian\AppData\Roaming\Typora\typora-user-images\image-20210620210540404.png)]$

3、自定义列表 dl dt dd

dl相当于ul一样的大的容器来装dt和dd

这里的dt是标题首行，dd是内容行，他们两是兄弟关系

<body>
			<dl>
				<dt>线下店家</dt>
				<dd>小迷之家</dd>
				<dd>网点</dd>
			</dl>
	</body>

最低0.47元/天解锁文章

Zhu Xiaopi

关注

4
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
HTML笔记整理

HTML笔记整理自学前端快一年了，现在感觉学的东西好多、好杂、好乱，知识不成体系，所以下定了决心花一点时间来整理一下学过的前端知识，帮助自己记忆的同时，也希望可以帮助到更多学习前端的小伙伴。这是我整理的第一篇——HTML笔记一、认识HTML1、html的发展史1993年（IETF）HTML 1.01995年（W3C） HTML 2.01996年（W3C） HTML 3.21997年（W3C） HTML 4.01999年（W3C） HTML 4.012000年（W3C） XHTML
复制链接

扫一扫