Introduction of HTML(4): Block, Class, Deployment, RWD and Frame

Published: by Creative Commons Licence

类别 ... ...
HTML
块		 <div>元素

定义文档中的分区或者节(division/section)

HTML<div>是块级元素，可用于组合其他HTML元素的容器。
如果与CSS一起使用，<div>元素可用于对大的内容块设置样式属性。
<div>的另一个常见用途是文档布局。取代了使用表格定义布局的老式方法。
<span>元素

定义span，用来组合文档中的行内元素

HTML<span>元素是内联元素，用于文本的容器。
如果与CSS一起使用，<span>元素可用于为部分文本设置样式属性。
HTML
类		 对HTML进行分类（设置类），是我们能够为元素的类定义CSS样式。
为相同的类设置相同的样式，或者为不同的类设置不同的样式。
HTML<div>是块级元素。他能够作为其他HTML元素的容器。 设置<div>元素的类，是我们可以为相同的<div>元素设置相同的类。
HTML<span>元素是行内元素，能够用作文本的容器。
设置<span>元素的类，能够为相同的<span>设置相同的样式。
详情点击此处跳转
HTML
布局		 使用<div>元素的HTML布局 <div>元素常用作布局工具，因为能够轻松地通过CSS对其进行定位
使用HTML5的网站布局
使用表格的HTML布局 <table>不时作为布局工具而设计的
使用<table>能够取得布局效果，是因为能够通过CSS设置表格元素的样式。
点击超链接跳转
HTML
相应式Web布局		 什么是Web设计
  • RWD指的是响应式Web设计(Responsive Web Design)
  • RWD能够以可变尺寸传递网页
  • RWD对于平板和移动设备是必须的
实现响应式设计的方法
  1. 自己创建一个响应式设计
  2. 使用Bootstrap(这是一个CSS框架)
详情点击跳转
HTML
框架		 使用框架，实现在同一个浏览器窗口中显示不止一个页面。
每份HTML文档称为一个框架，并且每个框架都独立于其他框架
框架结构标签(<frameset>)
  • 框架结构标签定义如何将窗口分割为框架
  • 每个frameset定义了一系列行或列
  • rows / columns 的值规定了每行或每列占据屏幕的面积
详情点击链接跳转
HTML
内联框架		 用于在网页内显示网页；定义内联的子窗口(框架)
添加iframe的语法 
<iframe src="URL"></iframe>
删除边框 
<iframe src="URL" frameborder="0"></iframe>
使用iframe作为
链接的目标		 
<iframe src="demo_iframe.htm" name="iframe_a"></iframe> 
<p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>