html的基础知识
文档的基本结构
题目一级标题
脑图
html_基础的结构
常见元素
结构类
定义了文档的框架结构
块级元素,标题,1-6 字体逐渐减小
块级元素,组织文本的段落
内联元素,文本容器,结合CSS设置样式
将页面分栏显示不同的html文版内连框架
- Coffee
- Milk
- Coffee
- Milk
-
Coffee
- Black hot drink Milk
- White cold drink
其中
内容类
标签代表一类的特殊内容
定义缩写,WHO
定义首字母缩写
地址块引用插入前后换行的外边距定义引用和引证,
The Scream by Edward Munch. Painted in 1893.
![](w3school.jpg) 图片
短引用,内容加引号计算机相关的内容类
定义计算机代码。
适合定义计算机代码。定义键盘输入。
定义计算机代码样本。
定义打字机代码。
元素定义数学变量:
定义预格式文本。 不赞成使用。使用代替。不赞成使用。使用
代替。不赞成使用。使用代替。修饰形容类
对内容或者格式起修饰和形容
横线
删除线下划线
换行预格式文本,保留格式,适合代码块文本样式修饰类
定义文字方向 This text will be written from right to left
定义粗体文本。
定义大号字。
定义着重文字。
定义斜体字。
定义小号字。
定义加重语气。
定义下标字。
定义上标字。
定义插入字。
定义删除字。
不赞成使用。使用代替。
不赞成使用。使用代替。不赞成使用。使用样式(style)代替。
块级元素内联元素及嵌套
块级元素用来搭建网站架构、布局、承载内容,包括 div、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 内可以包含 div 标签,li 和 div 标签都是装载内容的容器,地位平等,没有级别之分
块级元素与块级元素并列、内嵌元素与内嵌元素并列
标签不能包含,,—— 对元素细节
超链
超链接可以文字或者图像,通过使用 href 属性 创建指向另一个文档的链接,通过使用 name 属性 创建文档内的书签
指向邮箱的链接,发送邮件!
图片作为超链, ![](/i/eg_buttonnext.gif)
target = "_blank" or "showframe" or none指定打开文档的显示位置为 新窗口 或 框架 或 当前页面
target = "iframe_name" 显示到指定的 iframe,
跳转当页面制定的锚点,制作目录 ,基本的注意事项 - 有用的提示 --创建锚点-- 有用的提示,--本文档中跳转到书签-- 有用的提示--UML中添加直接跳转--
图片
URL 可以是相对路径和绝对路径 ,![](/i/ct_netscape.jpg)
alt 替换文本,指定图片显示失败时的替换文本,![](boat.gif)
嵌入图片与文字的竖直方向的对齐方式,![](/i/eg_cute.gif) middle top;水平方向的位置,
指定图片的大小 ![](w3school.jpg)
图片的边框 border="0"
带有可点击区域的图像映射
area 元素永远嵌套在 map 元素内部。area 元素可定义图像映射中的区域
中的 usemap 属性可引用 中的 id 或 name 属性(取决于浏览器),所以我们应同时向 添加 id 和 name 属性。
![](planets.jpg)
列表
无序列表
基本用例
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 定义快捷键
style 定义样式
webabcd
class 指定需要应用的 css 类选择器
class.myClass { font-size:36px; }
.myClass2 { color:Blue; }
webabcd
title 描述文档信息
![头像](http://upload-images.jianshu.io/upload_images/3561258-9e80624cc7ca4b79.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
id 用于定义元素的唯一标识,主要给 DOM 用,
id与name的区别
W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。
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)© ©
® 注册商标 ® ®
™ 商标 ™ ™
× 乘号 × ×
÷ 除号 ÷ ÷
颜色
查询手册