html div 浮动

html-css07

html div 浮动,第1张

不知道是不是这个效果,代码:

<div style="width:200pxheight:500pxborder:1px solid #f00float:left"></div>

  <div style="width:800pxfloat:left">

      <div style="width:300pxheight:200pxborder:1px solid #f00float:left"></div>

      <div style="width:300pxheight:200pxborder:1px solid #f00float:left"></div>

      <div style="width:300pxheight:200pxborder:1px solid #f00float:left"></div>

      <div style="width:300pxheight:200pxborder:1px solid #f00float:left"></div>

      <div style="width:600pxheight:200pxborder:1px solid #f00float:left"></div>

  </div>

设置div样式 z-index:auto

auto可定义为一个值(整数数字),越大代表越置前,如可定义为: z-index:999。

前提是div是定位元素代码实例如下:

1、<html>

2、 <body>

3、<style type="text/css">

3、.div1{ width: 200px height: 100px background: red float: left }

5、.div2{ width: 300px height: 350px background: yellow }

6、</style>

7、 <div class="div1"></div>

8、<div class="div2"></div>

9、 </body>

10、</html>

扩展资料

一个网页对应多个HTML文件,超文本标记语言文件以.htm(磁盘操作系统DOS限制的外语缩写)为扩展名或.html(外语缩写)为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件,只用修改文件后缀即可。

标准的超文本标记语言文件都具有一个基本的整体结构,标记一般都是成对出现(部分标记除外例如:<br/>),即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。

参考资料

百度百科-html