HTML系列知识(四)

HTML块 div span

<div>

<span>

这两种标签都是布局用的

这种标签本身没有任何显示效果

通常是用来结合css进行页面布局

div 和 span 看不出任何效果

<div> 这是一个div </div>

<span>这是一个span</span>

div布局

一个简单的div布局的例子

注: 这里使用了style外边距样式,margin-left:50px 指的是左边距50个像素

需要对两个图片进行左边距控制

如果不使用div,则需要对每一个图像设置边距

使用了div后,先把两个图像都放在一个div里

只需要设置div的边距,就可以达到两个图片都移动的效果

<div  style="margin-left:100px">

 <img  src="http://how2j.cn/example.gif"/>

  <br/>

 <img  src="http://how2j.cn/example.gif"/>

</div>

div和span的区别 

div是块元素,即自动换行

常见的块元素还有h1,table,p

span是内联元素,即不会换行

常见的内联元素还有img,a,b,strong

<div>

 第一个div

</div>

<div>

 第二个div

</div>

<span>

 第一个span

</span>

<span>

 第二个span

</span>

HTML内联框架

<iframe> 即内联框架

通过内联框架 可以实现在网页中“插入”网页

<iframe  src="http://how2j.cn/"  width="600px"  height="400px">

</iframe>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。