HTML1-11

  • 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>

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

翠嘴 打烂她的果

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值