0%

HTML学习记录

HTML的一些基础知识。

介绍

  html全称为:超文本标记语言 (Hyper Text Markup Language, HTML),是用于建立网页的标准标记语言,由成双成对的标签组合而成。

html 基本结构

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head lang="语言">
<meta charset="UTF-8"><!-- 设置编码 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- 设置设备缩放比例 -->
<link rel="shortcut icon" href="url..." ><!-- 网页图标(logo) -->
<title>网页标题</title>
</head>
<body>
...Content...
HTML5新增语义元素
<header>...</header>
<nav>...</nav>
<section>...</section>
<article>...</article>
<aside>...</aside>
<footer>...</footer>
</body>
</html>

常用代码与标签

常用标签

  自己找吧懒得写了嘻嘻

粗体和斜体

  一般我们粗体和斜体使用的都是<b><i>,但是如果是强调作用的话,我们一般推荐使用<strong><em>,他们更有利于SEO。

实体符号

HTML语义元素 & 媒体元素

语义元素描述
<header>定义文档或节的页眉
<nav>定义文档内的导航连结
<article>定义文档内的文章
<section>定义文档中的节
<aside>定义页面内容之外的内容
<footer>定义文档或节的页脚
<main>定义文档的主内容
<mark>定义重要或强调的内容
<bdi>定义与其他文本不同的文本方向
<details>定义用户可查看或隐藏的额外细节
<summary>定义 <details> 元素的可见标题
<dialog>定义对话方块或窗口
<figure>定义自包含内容,如图示、图表、照片、代码清单等
<figcaption>定义 <figure> 元素的标题
<menuitem>定义使用者能够从弹出功能表的命令/功能表项目
<meter>定义已知范围(尺度)内的标量测量
<progress>定义任务进度
<rp>定义在不支持 ruby 注释的浏览器中显示什么
<rt>定义关于字符的解释/发音(用于东亚字体)
<ruby>定义 ruby 注释(用于东亚字体)
<time>定义日期/时间
<wbr>定义可能的折行(line-break)
媒体元素描述
<audio>定义声音或音乐内容
<embed>定义外部应用程序的容器(比如外挂程序、SVG等),单标签。ps:使用SVG图片时,可能会失焦,若要设置点击事件可设置css[pointer-events: none;],然后给其父元素设置click。
<source>定义 <video><audio> 的来源
<track>定义 <video><audio> 的轨道
<video>定义视频或影片内容

HTML5 newAPI

  • Canvas
  • Drop & Drag Event
  • Touch Event
  • Geolocation
  • Web Socket
  • Video & Audio
  • Local Storage & Session Storage
  • Cache
  • Notification

补充

html使用SVG的另一种方式Object

1
2
3
<object type="image/svg xml" data="./test.svg" style="...">
<param name="src" value="./test.svg" >
</object>

关于html头部语言

  • zh-CN其实已经算弃用了
  • 简体中文页面:html lang = zh-cmn-Hans
  • 繁体中文页面:html lang = zh-cmn-Hant
  • 英语页面:html lang = en

还有需要加地区代码的情况(一般比较少,除非为了强调不同地区汉语使用差异。)比如:

1
2
3
4
5
6
7
<p lang="zh-cmn-Hans">
<b lang="zh-cmn-Hans-CN">菠萝</b>
<b lang="zh-cmn-Hant-TW"></b>
其实是同一种水果。
只是大陆和台湾称谓不同,且新马一带的称谓也是不同的,称之为黄梨。
<b lang="zh-cmn-Hans-SG">黄梨</b>
</p>

当然,由于历史原因,有时候不得不继续使用zh-CN。比如中文维基百科,沿用了传统的zh-CN/zh-HK/zh-SG/zh-TW(按照标准应该使用 zh-cmn-Hans-CN、zh-cmn-Hant-HK、zh-cmn-Hans-SG、zh-cmn-Hant-TW)。这时候,合理的软件行为,是将 zh-CN 等转化为 zh-cmn-Hans(即转化为最常见的误用所对应的实际标准写法)。
实际上,各相关标准,也存在一定的滞后,见仁见智咯。

----------文章已到底啦  感谢您的阅读----------
给博主来杯卡布奇诺~
DoubleAm 微信 微信
DoubleAm 支付宝 支付宝
  • 博主: DoubleAm
  • 本文链接: http://a.biugle.cn/htmlstudy/
  • 版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
bulb