HTML入门笔记
Posted liaoai
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML入门笔记相关的知识，希望对你有一定的参考价值。
一、html5概述
一种超文本标记语言。 HTML5其中重要的三项技术分别为：HTML5核心规范、CSS、javascript。
二、文档结构
<!DOCTYPE html> //文档类型声明
<html lang=”zh-cn”> //表示文档开始（英文用en）
<head> //包含文档元素据开始（不可见）
<meta charset=”utf-8”> //声明字符编码
<title>基本结构</title> //设置文档标题
</head> //包含文档元素据结束
<body> //表示HTML文档内容（可见）
xxxxxxxxxxxxx
</body>
</html> //表示文档结束
注：
Doctype 文档类型声明 <!DOCTYPE html>
html（标签）双标签，头尾呼应
head 包含元数据内容 (页面不可见)
meta 提供关于文档的信息
title 设置标题
body 包含文档内容的元素 （浏览器可见区域部分）
（双标签 例如head后直接加tab键可以直接出现html格式，前提是文件已保存。）
三、文本元素
| 元素名称 | 说明 |
|---|---|
| a | 生成超链接 |
| br | 强制换行 |
| wbr | 可安全换行 |
| b | 标记一段文字但不强调 |
| strong | 表示重要 |
| i | 表示外文或科学术语 |
| em | 表示强调 |
| code | 表示计算机代码 |
| var | 表示程序输出 |
| samp | 表示变量 |
| kdb | 表示用户输入 |
| abbr | 表示缩写 |
| cite | 表示其他作品的标题 |
| del | 表示被删除的文字 |
| s | 表示文字已不再确认 |
| dfn | 表示术语定义 |
| mark | 表示与另一段上下文有关的内容 |
| q | 表示引自他处的内容 |
| rp | 与ruby元素结合使用，标记括号 |
| rt | 与ruby元素结合使用，标记括号 |
| ruby | 表示位于表意文字上方或右方的注音符号 |
| bdo | 控制文字的方向 |
| small | 表示小号字体内容 |
| sub | 表示下标字体 |
| sup | 表示上标字体 |
| time | 表示时间或日期 |
| u | 标记一段文字但不强调 |
| span | 通用元素，没有任何语义。一般配合CSS修饰。 |
注：
ctrl+？=注释
b、strong 加粗
i、var倾斜
s、del 加删除线
u、ins 加下划线
q 加双引号
mark 黄色背景黑色字
四、超链接和路径
i.超链接属性
| 属性名称 | 说明 |
|---|---|
| href | 指定元素所指资源的URL |
| hreflang | 指向的链接资源所使用的语言 |
| media | 说明所链接资源用于哪种设备 |
| rel | 说明文档与所链接资源的关系类型 |
| target | 指定用以打开所链接资源的浏览环境 |
| type | |
| target属性 | |
| 属性名称 | 说明 |
| -------- | ------------------------------ |
| blank | 在新窗口或标签页中打开文档 |
| parent | 在父窗框组(frameset)中打开文档 |
| _self | 在当前窗口打开文档（默认） |
| _top | 在顶层窗口打开文档 |
例如：
<a href="http:www.baidu.com" target="_blank">
ii.相对路径与绝对路径
1.绝对路径： 当整个目录转移到另外的盘符或其他电脑时，目录结构一旦出现任何变化，链接当即失效。
<a href="file:///磁盘符+目录层次x.html">名称</a>
2.相对路径条件： 必须文件都在一个磁盘或目录下
注： 如果一个主目录有多个子目录层次等其他情况 使用目录语法：
同一个目录: index2.html或./index2.html;
在子目录: xxx/index2.html;
在孙子目录: xxx/xxx/index2.html;
在父目录: ../index2.html;
在爷爷目录: ../ ../index2.html;
3.锚点设置：
//链接
<a href="#1">第一章</a> <a href="#2">第二章</a> <a href="#3">第三章</a>
//锚点
<a name="1"></a> <a id="3"></a>
以上是关于HTML入门笔记的主要内容，如果未能解决你的问题，请参考以下文章
Unity Shader入门精要学习笔记 - 第5章 开始 Unity Shader 学习之旅
Cg入门20：Fragment shader - 片段级模型动态变色（实现汽车动态换漆）