我想在一个html 上面生成好多小方块,结果与百度图片那种相似，方块大小是相同的，
（1） 实现的方法 就是设置 div 的float 属性就可以了 left
div { background-color:Gray; width:150px; height:150px; float:left; margin:10px;}
（2）怎么让div 的文字显示在div 的中央
text-align:center; line-height:150px;text-align:center;(水平居中)line-height:和高一样的参数;(垂直居中)，
（3）怎么让div 显示在页面的特定部位
<div style='position:absolute;top:20%;left:15%;z-index:9; width:800px; height:600px'></div>
（4） 使用jiathis 分享
<script type="text/javascript" src="http://v3.jiathis.com/code/jiathis_r.js?uid=1356925732494226&move=0" charset="utf-8"></script>
将这句话加入到body 里面就行了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<style type="text/css" >
.group1 { background-color:Gray; width:150px; height:150px; float:left; margin:10px; text-align:center; line-height:150px;}
.group2 { background-color:Gray; width:80px; height:80px; margin-left:0px; margin-right:10px; margin-bottom:10px; margin-top:10px; text-align:center;line-height:80px; }
.group3 { background-color:Gray; width:80px; height:80px; float:left; margin-right:10px; text-align:center;line-height:80px; }
</style>
<!-- JiaThis Button BEGIN -->
<script type="text/javascript" src="http://v3.jiathis.com/code/jiathis_r.js?uid=1356925732494226&move=0" charset="utf-8"></script>
<!-- JiaThis Button END -->
</head>
<body>
<div id="leftbar" style='position:absolute;top:20%;z-index:9; margin:0px; width:100px; height:600px'>
<div class="group2">2</div>
<div class="group2">2</div>
<div class="group2">2</div>
<div class="group2">2</div>
<div class="group2">2</div>
</div>
<div id="topbar" style=" position:absolute; top:0%; margin-left:200px; width:800px; height:100px" >
<div class="group3">3</div>
<div class="group3">3</div>
<div class="group3">3</div>
<div class="group3">3</div>
<div class="group3">3</div>
</div>
<div style='position:absolute;top:20%;left:15%;z-index:9; width:800px; height:600px'>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
<div class="group1">1</div>
</div>
<script type="text/javascript" src="http://v3.jiathis.com/code/jiathis_r.js?uid=1356925732494226&move=0" charset="utf-8"></script>
</body>
</html>
2049
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
