HTML5标签和属性思维导图
HTML5标签和属性内容详述
树图思维导图提供 HTML5标签和属性 在线思维导图免费制作，点击“编辑”按钮，可对 HTML5标签和属性 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：b6a05196be86d17cfbfe3dfd7c722583
思维导图大纲
HTML5标签和属性思维导图模板大纲
2.1文本控制标签
1.页面格式化标签
1.标题标签
6个等级标签
h1-h6（重要程度依次递减）
书写方式
<hn align="对齐方式">标题文本</hn>
align属性
lift
center
right
eg：
<h2 align="center"> 床前明月光，</h2> <h2 align="center">疑是地上<mark>霜</mark>。</h2> <h2 align="center">举头望明月，</h2> <h2 align="center">低头思故乡。<br>di tou si gu xiang.</h2>
2.段落标签
<p>
书写方式
<p align="对齐方式">段落文本</p>
3.水平线标签
<hr>
书写方式
<hr 属性="属性值" />
属性
align对齐方式
lift,center,right
size水平线的粗细
单位（px）像素，默认2px
color颜色
red，blun。。。。。
width宽度
eg：
<hr color="green" size="2" > <hr color="red" size="5" >
4.换行标签
<br>
书写方式
<p>使用HTML5制作网页时通过换行标签<br />可以实现黄行效果</p>
2.文本格式化标签
<b>标签和<strong>标签
加粗
<strong><h1 align="center" aria-setsize="5">数学学习</h1></strong>
<u>标签和<ins>标签
下划线
<i>标签和<em>标签
斜体
<s>标签和<del>标签
删除线
<cite>标签
斜体显示，常用于参考文献引用
<time>标签
时间和日期
<mark>标签
底色样式
3.文本样式标签
书写方式
<font 属性="属性值">文本内容</font>
属性
face
字体：微软雅黑...
size
字号：1-7，无单位
color
颜色：英文名称
4.特殊字符
空格符
 
<
&it
>
>
&
和
&
人民币符号
¥
版权符号
©
商标注册符号
®
度数符号
°
正负号
±
x
×
➗
÷
2（上标）
平方
²
3(下标）
立方
³
2.2图像标签
1.常用图像格式
GIF,PNG,JPEG
2.图像标签及其属性
语法
<img src="图像 URL"/>
src图像路径
3.属性
alt
用于设置图像的替代文本
<img src="images/tao.png" alt="彩陶"/>
images图片所在文件夹
tao。png图片名称
彩陶（文本名称）
title
用于设置鼠标停在图片上时显示图片名称
width和height
设置图像高度宽度
border
添加边框
vspace和hspace
排版
align
图片位置
2.3列表标签
1.无序列表
<ul>标签
<li>标签嵌套在<ul>标签里
2.type属性
disc（默认值）
黑色圆点
circle
白色圆点
square
黑色方点
3.有序列表
<ol>标签
4.type属性
1（默认）
A或a
I或i
start
数字
指定全部列表项目起始值
value
数字
指定当前列表项目起始值
reversed
排列顺序为降序
5.定义列表
<dl>标签用于定义列表
<dd>标签和<dt>标签都嵌套在<dl>标签里
eg:
<dl> <h6><li><dt>有机化学</dt></li></h6> <dd>有机化学 (Organic Chemistry)又称为 碳化 合物的 化学，是研究 有机化合物 的组成、结构、性质、制备方法与应用的 科学，是化学中极重要的一个分支。</dd> <dd>中文名: 有机化学</dd> <dd>外文名: Organic Chemistry</dd> <dd>学科门类: 二级学科</dd> <dd>定义: 研究有机物的化学</dd> <dd>对象: 烃及其衍生物</dd></dd>
2.4超链接标签
1.创建超链接
<a>标签
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
2.锚点链接
1.创建锚点链接对象
<a href="#id">链接文本</a>
2.创建锚点跳转目标
<标签 id="id">显示内容</标签>
2.5结构标签
<header>
引导作用结构标签
<hearder> <h1>文字内容</h1> </hearder>
<nav>
定义导航链接
<nav> <ul> <li><a href="#">首页</li> </ul> </nav>
<footer>
定义页面底部内容
<footer>页面或页面中某部分的底部内容</footer>
<article>
定义文件，页面或应用程序与上下文不相关的独立部分
<artical><header><h1>秋天的味道</h1><p>你想不想知道秋天的味道？</p></header>
<section>
定义一段专题内容
<aside>
定义页面中的附属信息部分
<figure>/<figcaption>
定义独立的网页内容
<hgroup>
将多个标题组成一个标题组
2.6页面交互标签
<details>/<summary>
用于标签可以在网页中实现让一段文字或标题包含隐藏的信息
<progress>
用来定义进度条
语法
<progress 属性="属性值"></progress>
<meter>
用来定义给定范围内的数据
<meter 属性="属性值"></meter>
2.7全局属性
<draggble>
用来设置页面元素是否能拖动。该属性有两个值（true和false）
<hidden>
用于隐藏页面元素
语句
<p hidden>........</p>
contenteditable
指定网页内容是否可以编辑
子主题 2思维导图模板大纲
相关思维导图模板
树图思维导图提供 904名中国成年人第三磨牙相关知识、态度、行为和病史的横断面调查 在线思维导图免费制作，点击“编辑”按钮，可对 904名中国成年人第三磨牙相关知识、态度、行为和病史的横断面调查 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：10b9a8a2dd2fb4593f8130ef16c320fc
树图思维导图提供 光和影 在线思维导图免费制作，点击“编辑”按钮，可对 光和影 进行在线思维导图编辑，本思维导图属于思维导图模板主题，文件编号是：2f4c9606f70a3f8d98ec4d65695dc3d1
相关思维导图专辑
Copyright©2022-2025 树图网shutu.cn 版权所有|上海聚石塔网络科技有限公司|网站备案号：沪ICP备2021036420号-3|
沪公网安备 31011502019485号|
上海工商