本章内容
- HTML5框架
- HTML5背景
- HTML5实体
HTML框架
-
框架标签(frame):
框架对于页面的设计有着很大的作用
- 框架集标签(
<frameset>
) :
框架集标签定义如何将窗口分割为框架
每一个frameset定义一系列行或列
rows/cols的值规定了每行或每列占据屏幕的面积
-
常用标签:
noresize: 固定框架大小
cols:列
rows:行
-
内联框架
iframe
frame demo
frameset 不能写到body里面
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>框架</title>
<head/>
<frameset cols="20%, 30%, 50%">
<frame src="framea.html"/>
<frame src="frameb.html"/>
<frame src="framec.html"/>
</frameset>
</html>
效果
iframe 标签的使用
代码
index.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>框架</title>
<head/>
<br/>
<br/>
<iframe src="framec.html" frameborder="0" width="800px" height="800px">
</iframe>
framea.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body bgcolor="#6495ed">
framea
<a href="http://www.baidu.com" target="_top">baidu</a>
</body>
</html>
frameb.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body bgcolor="#ff7f50">
frameb
<br/>
<iframe src="framea.html" width="400" height="400"></iframe>
</body>
</html>
framec.html
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body bgcolor="aqua">
framec
<br/>
<iframe src="frameb.html" width="600px" height="600px"></iframe>
</body>
</html>
大体效果
同时,在framea.html中
<a>
在这里可以 依次使用 target的属性值,四中模式下不同的展示:
1. 默认和_self会在 framea 中展示
2. _blank 会另外打开一个页面
3. _parent 会在 frameb中打开链接
4. _top 不是在 framec中打开链接,而且在包裹着这所有的当前页面展示
HTML5背景
-
背景标签
Background
-
背景颜色
Bgcolor
-
颜色
颜色是由一个十六进制符号来定义,这个符号由红色、绿色和蓝色的值组成(RGB)
颜色值最小值:0(#00)
颜色值最大值:255(#FF)
红色: #FF0000
绿色: #00FF00
蓝色: #0000FF
HTML5实体
-
HTML中预留字符串必须被替换成字符实体
如:
代码<、>、&
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>背景</title>
<head/>
<body>
abcd
<abcd>
<abcd>
</body>
</html>
效果
在真实开发当中,不需要记忆,直接百度 HTML 实体就OK了