html的基础知识

文档的基本结构

题目

一级标题

脑图

html_基础的结构

常见元素

结构类

定义了文档的框架结构

块级元素，标题，1-6 字体逐渐减小

块级元素，组织文本的段落

块级元素其他元素的容器，常用来主旨章节；结合CSS设置样式；及文档布局

内联元素，文本容器，结合CSS设置样式

将页面分栏显示不同的html文版

内连框架

• Coffee
• Milk

无序列表

Coffee

Milk

有序列表Coffee

Black hot drink

Milk

White cold drink

自定义列表，dt为标题，dd为注释

其中

内容类

标签代表一类的特殊内容

超链接

定义缩写，WHO

定义首字母缩写

地址块引用插入前后换行的外边距

定义引用和引证,

The Scream by Edward Munch. Painted in 1893.

 图片

短引用，内容加引号

计算机相关的内容类

定义计算机代码。

适合定义计算机代码。

定义键盘输入。

定义计算机代码样本。

定义打字机代码。

元素定义数学变量：

定义预格式文本。 不赞成使用。使用 代替。

不赞成使用。使用

代替。 不赞成使用。使用 代替。

修饰形容类

对内容或者格式起修饰和形容

---

横线

删除线

下划线

定义下标字。

定义上标字。

定义插入字。

定义删除字。

不赞成使用。使用 代替。

不赞成使用。使用 代替。

不赞成使用。使用样式(style)代替。

块级元素内联元素及嵌套

块级元素用来搭建网站架构、布局、承载内容，包括 p、ul、li、dl、dt、dd、h1~h6、p、address, etc

内嵌元素 一般用在网站内容之中的某些细节或部位的定义与修饰，用以“强调、区分样式、上标、下标、锚点”等等，包括 a, sapn, strong, sub, sup, img, etc

块元素和内嵌元素是可以相互转换的，如 display: block; /* 转成块元素 */,display: inline; /* 转成内嵌元素 */

块级元素是盒子，不管里面有多少东西，外部可以设置其宽高; 内嵌元素是袋子其宽高由内部的东西撑起来。

嵌套规则

块元素可以包含内联元素或某些块元素，但内联元素却不能包含块元素，它只能包含其它的内联元素

块级元素不能放在

里面

h1-6、p、dt 只能包含只能包含内嵌元素，不能再包含块级元素

li 内可以包含 p 标签，li 和 p 标签都是装载内容的容器，地位平等，没有级别之分

块级元素与块级元素并列、内嵌元素与内嵌元素并列

标签不能包含,, —— 对

元素细节

超链

超链接可以文字或者图像，通过使用 href 属性 创建指向另一个文档的链接，通过使用 name 属性 创建文档内的书签

指向邮箱的链接，发送邮件！

无下划线的超链，

图片作为超链， 

target = "_blank" or "showframe" or none指定打开文档的显示位置为 新窗口 或 框架 或 当前页面

target = "iframe_name" 显示到指定的 iframe,

W3School.com.cn

跳转当页面制定的锚点，制作目录 ,基本的注意事项 - 有用的提示 --创建锚点-- 有用的提示，--本文档中跳转到书签-- 有用的提示--UML中添加直接跳转--

图片

URL 可以是相对路径和绝对路径 ，

alt 替换文本，指定图片显示失败时的替换文本，

嵌入图片与文字的竖直方向的对齐方式， middle top;水平方向的位置，

指定图片的大小 

图片的边框 border="0"

带有可点击区域的图像映射

area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域

中的 usemap 属性可引用 中的 id 或 name 属性(取决于浏览器)，所以我们应同时向 添加 id 和 name 属性。


列表

无序列表

基本用例

CoffeeMilk

项目符号

有序列表

基本用例

CoffeeMilk

项目编号

, 或 “a”, “I”, “i”

自定义列表

基本用例

Coffee Black hot drink MilkWhite cold drink

通用属性

元素的通用属性 - accesskey, style, class, title, tabindex, id, dir, spellcheck, hidden, contenteditable, contextmenu, draggable, dropzone

accesskey 定义快捷键

webabcd blog

webabcd blog

style 定义样式

webabcd

class 指定需要应用的 css 类选择器

class

.myClass { font-size:36px; }

.myClass2 { color:Blue; }

webabcd

title 描述文档信息

webabcd blog


id 用于定义元素的唯一标识，主要给 DOM 用，

id与name的区别

W3C 文档对象模型 (DOM) 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。

webabcd blog

dir 文本排列方向，可能的值有：auto|ltr|rtl

123

spellcheck - 是否使用浏览器的拼写检查功能对元素内的内容做拼写检查

hidden - 用于隐藏元素

contenteditable - 用于定义内容是否可编辑

ontextmenu - 指定上下文菜单的数据源

draggable - 元素是否可拖拽；dropzone - 拖放的目标元素

脚本

标签提供无法使用脚本时的替代内容，比方在浏览器禁用脚本时，或浏览器不支持客户端脚本时。

如果浏览器压根没法识别

待深入

附录

meta 中定义类型、编码、作者、时间、编辑器、重定向

类型和编码格式

作者

审核

编辑软件

重定向

针对搜索引擎的，一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引您的页面

关键字

描述

URL统一资源定位符

统一资源定位器(URL)用于定位万维网上的文档(或其他数据),样式为 scheme://host.domain:port/path/filename

scheme包含 http(超文本传输协议), 以 http:// 开头的普通网页。不加密; https(安全超文本传输协议) 安全网页。加密所有信息交换; ftp(文件传输协议)用于将文件下载或上传至网站; file 浏览本地计算机上的文件。

编码; URL 只能使用 ASCII 字符集来通过因特网进行发送, 使用 "%" 其后跟随两位的十六进制数来替换非 ASCII 字符, + 来替换空格

字符实体

某些符号是预留的，如果需要显示采用字符实体，&entity_name; 或 entity_name;

空格    

< 小于号 < <

> 大于号 > >

& 和号 & &

" 引号 " "

' 撇号 ' (IE不支持) '

￠ 分(cent) ¢ ¢

£ 镑(pound) £ £

¥ 元(yen) ¥ ¥

€ 欧元(euro) € €

§ 小节 § §

© 版权(copyright)© ©

® 注册商标 ® ®

™ 商标 ™ ™

× 乘号 × ×

÷ 除号 ÷ ÷

颜色

查询手册