- HTML 指的是超文本标记语言: HyperText Markup Language
- HTML 不是一种编程语言,而是一种标记语言
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
- HTML 文档包含了HTML 标签及文本内容
- HTML文档也叫做 web 页面
vs code 新建文本文件,右键文件名,选择以默认浏览器打开(先下载open in browser拓展)
<!DOCTYPE html>此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。声明文档的解析类型(document.compatMode),避免浏览器的怪异模式。
<html>
<head>定义文档的头部,这些标签可用在 head 部分:<base>
, <link>
, <meta>
<meta> 标签提供了元数据.元数据也不显示在页面上,但会被浏览器解析。
META 元素通常用于指定网页的描述,关键词,文件的最后修改时间,作者,和其他元数据。
设置每30秒钟刷新当前页面: <meta http-equiv="refresh" content="30">
, <script>
, <style>
, <title>
。
<base href="http://www.w3school.com.cn/i/" />
<base target="_blank" />
<base>
必需的属性:href,值为URL,规定页面中所有相对链接的基准URL。包括 <a>
、<img>
、<link>
、<form>
标签中的 URL。<img src="eg_smile.gif" /><br />等于两个拼接。target,值为_blank在新窗口中打开、_parent在父窗口中打开新的页面(页面中使用框架才有用)、_self在同一个窗口打开新的页面、_top以整个浏览器作为窗口显示新页面(突破了页面框架的限制)、framename等,表明在何处打开页面中所有的链接。比如”_blank”意为在新窗口中打开。
在HTML中插入CSS样式表的三种方法:link<link> 标签定义了文档与外部资源之间的关系,和两种style,内部样式表用的是style标签<style>
<style> 标签定义了HTML文档的样式文件引用地址.
在<style> 中你也可以直接添加样式来渲染 HTML 文档,内联样式用的是style属性。
<meta charset="utf-8">告知浏览器此页面属于什么字符编码格式,下一步浏览器做好“翻译”工作。常见的字符编码有:gb2312、gbk、unicode、utf-8。
<title>菜鸟教程(runoob.com)</title>定义文档的标题,它是 head 部分中唯一必需的元素。内容会显示在浏览器的标题栏中
</head>
<body><body> 元素定义了 HTML 文档的主体。
<h1>我的第一个标题</h1>标题Heading,从h1到h6文字大小和强调重要程度从1到6,依次减少。浏览器会自动地在标题的前后添加空行。
<p>我的第一个段落。</p>定义网页中的段落
</body>
</html>
标签 <a> 来定义链接,href 属性中指定链接的地址。
<a href="https://www.runoob.com">这是一个链接</a>
图像标签img:
<img decoding="async" src="/images/logo.png" width="258" height="39" />
标签的 decoding 属性用于告诉浏览器使用何种方式解析图像数据
sync: 同步解码图像,保证与其他内容一起显示。
async: 异步解码图像,加快显示其他内容。
auto: 默认模式,表示不偏好解码模式。由浏览器决定哪种方式更适合用户。
<br> 就是没有关闭标签的空元素(<br> 标签定义换行)。一般使用<br/>
<hr> 标签在 HTML 页面中创建水平线。可用于分隔内容。
<!-- 这是一个注释 -->
在网页内单击右键,然后选择"查看源文件"(IE)就可以看到自己想要看的网页源码了
注意:浏览器会自动地在段落的前后添加空行。(</p> 是块级元素)
<p>这个<br>段落<br>演示了分行的效果</p>
浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。
<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>
这是上下
通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用,表示强调和重要。
<big>这个文本字体放大</big>(同理还有small)
<pre>
此例演示如何使用 pre 标签
对空行和 空格
进行控制
</pre>
a
标签,超链接,是浏览器中最常见的标签,它最主要的作用是从一个页面跳转到另一个页面。
<a href="http://news.baidu.com/">百度新闻</a>
超链接可以是一个字,一个词,或者一组词,也可以是一幅图像
target 属性可以定义被链接的文档在何处显示,target="_blank"表示新窗口。
<abbr title="etcetera">etc.</abbr>
<acronym title="World Wide Web">WWW</acronym>
显示缩写,鼠标放上去显示引号里的全称。
<bdo dir="rtl">该段落文字从右到左显示。</bdo>
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>