HTML学习笔记
换行
水平线 3.拥有动画效果的下拉菜单 ......
学习网站https://www.w3school.com.cn/h.asp
持续学习,持续更新
基础
一.简介
1.HTML是一种超文本标记语言,标记标签来描述网页,不是编程语音。
2.HTML标签:尖括号关键词,成对出现,分为开始标签和结束标签(开发标签和闭合标签)。
3.HTML文档=网页: Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容。
二.编译器
1.使用 Notepad 或 TextEdit 来编写 HTML。
2.记事本更改后缀txt->html。
三.组成
1.标题:<h1>+</h1>
2.段落:<p>+</p>
3.链接:<a>+</a>
4.图像:<img>
eg:
<html>
<body>
<h1>标题</h1>
<p>段落</p>
<img src="w3school.jpg" width="104" height="142" />
图像的名称和尺寸是以属性的形式提供的。
</body>
</heml>
四.元素
1.HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。
2.大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)。
3.<p> 元素定义了 HTML 文档中的一个段落。
4.<body> 元素定义了 HTML 文档的主体。
5.<html> 元素定义了整个 HTML 文档。
6.在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
7.即使 <br> 在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。
<html>
<body>
<p>This is my first paragraph.</p>
</body>
</html>
五.属性
1.HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
2.属性总是以名称/值对的形式出现,比如:name=“value”。
3.属性总是在 HTML 元素的开始标签中规定。
4. 属性例子 1:
<h1> 定义标题的开始。
<h1 align=“center”> 拥有关于对齐方式的附加信息。
5.属性例子 2:
<body> 定义 HTML 文档的主体。
<body bgcolor=“yellow”> 拥有关于背景颜色的附加信息。
<table> 定义 HTML 表格。(您将在稍后的章节学习到更多有关 HTML 表格的内容)
属性参考手册
https://www.w3school.com.cn/tags/index.asp
六.标题
1.标题是网站的索引,h1–h6分别表示一级标题到六级标题
2.水平线<hr/>可以用于分割内容
3.注释方式<!-- This is a comment -->
七.段落
1.<p>是块级元素,浏览器会自动在后面添加空行
2.不要使用 <p></p> 去插入一个空行,用<br/>代替
3.不要忘记结束标签
4.未来的HTML版本中不允许使用时没有结束标签,<br/>比<br>更有保障
5.浏览器会移除源代码中多余的空格和换行,连续的空格和换行只会视作一个空格
八.样式
1.style 属性用于改变 HTML 元素的样式。
2.background-color 属性为元素定义了背景颜色。
<body style="background-color:yellow">
3.font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体。
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
4.text-align 属性规定了元素中文本的水平对齐方式。
<h1 style="text-align:center">This is a heading</h1>
九.格式化
1.文本格式化标签包括:
<b>This text is bold</b>
<br />
<strong>This text is strong</strong>
<br />
<big>This text is big</big>
<br />
<em>This text is emphasized</em>
<br />
<i>This text is italic</i>
<br />
<small>This text is small</small>
<br />
This text contains
<sub>subscript</sub>
<br />
This text contains
<sup>superscript</sup>
2.预格式文本,可以很好的保存空格和换行
<pre>+</pre>
3.计算机输出标签
<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />
4.地址标签:
<address>
Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>
5.缩进标签:
<abbr title="etcetera">etc.</abbr>
<br />
<acronym title="World Wide Web">WWW</acronym>
<p>在某些浏览器中,当您把鼠标移至缩略词语上时,title 可用于展示表达的完整版本。</p>
6.文字方向:
<p>
如果您的浏览器支持 bi-directional override (bdo),下一行会从右向左输出 (rtl);
</p>
<bdo dir="rtl">
Here is some Hebrew text
</bdo>
7.块引用:
这是长的引用:
<blockquote>
这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。这是长的引用。
</blockquote>
这是短的引用:
<q>
这是短的引用。
</q>
8.删除和下划线
<p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
<!--del删除,ins下划线-->
9.文本格式化标签表
标签 | 描述 |
---|---|
<b> | 定义粗体文本。 |
<big> | 定义大号字。 |
<em> | 定义着重文字。 |
<i> | 定义斜体字。 |
<small> | 定义小号字。 |
<strong> | 定义加重语气。 |
<sub> | 定义下标字。 |
<sup> | 定义上标字。 |
<ins> | 定义插入字。 |
<del> | 定义删除字。 |
10.“计算机输出”标签表
标签 | 描述 |
---|---|
<code> | 定义计算机代码。 |
<kbd> | 定义键盘码。 |
<samp> | 定义计算机代码样本。 |
<tt> | 定义打字机代码。 |
<var> | 定义变量。 |
<pre> | 定义预格式文本。 |
11.引用、引用和术语定义表
标签 | 描述 |
---|---|
<abbr> | 定义缩写。 |
<acronym> | 定义首字母缩写。 |
<address> | 定义地址。 |
<bdo> | 定义文字方向。 |
<blockquote> | 定义长的引用。 |
<q> | 定义短的引用语。 |
<cite> | 定义引用、引证。 |
<dfn> | 定义一个定义项目。 |
本文地址:https://blog.csdn.net/qq_50216270/article/details/112475346