HTML Iframes & Responsive Web Design

HTML Iframes

iframe 是用来在一个网页视图中显示网页。

<iframe src="URL"></iframe>

src 属性指定了要显示的网页地址。

Set Height and Width

使用 width 和 height 属性来设定大小。默认情况下以 pixels 为单位，也可以是百分数 （像 “80%”）

<iframe src="demo_iframe.htm" width="200" height="200"></iframe>

Remove the Border

默认 iframe 元素有一个黑色的边框。使用 CSS border 性质来设置这个边框。如去除边框，border：none；

use iframe as a Target for a link

链接的 target 属性值要等于 iframe 的
name 值，则点击链接，所指向的页面将在iframe中显示。

<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="http://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>

Responsive Web Design

RWD means that the page uses the same URL and the same code whether the user is on a desktop computer, tablet, or mobile phone – only the display adjusts or “responds” according to the screen size. Google recommends using RWD over other design patterns.

响应式web设计是说网页使用相同的URL和相同的代码，不论用户是通过台式机电脑、平板电脑或者手机来访问网——-只有显示的内容在调整或者根据屏幕尺寸“响应”。谷歌推荐使用RWD而不是其他设计模型。

tip：可以使用 float：left；在浏览器窗口尺寸变小时，块级元素会自己掉下来。此外，可以使用像Bootstrap这样的框架。