开发者社区> 问答> 正文

关于一个CSS布局该怎么写的问题

今天写了一个简单的布局,然而写完之后觉得CSS文件真心丑哭我,写的太烂了,先说说效果页面:……算了,直接上图吧。
screenshot
再看看代码:

<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
*{
  margin:0px;
  padding:0px;
}
box{
  width:900px;
  height:800px;
  margin:auto;
  background-color:#ccc;
}
left{
  width:450px;
  height:800px;
  margin:0px;
  background-color:red;
}
right{
  width:450px;
  height:800px;
  margin-left:450px;
  margin-top:-800px;
  background-color:blue;
}
middle{
  margin:-625px auto auto auto;
  width:450px;
  height:450px;
  background-color:#ccc;
}
</style>
</head>

<body>
<div id="box">
<div id="left"></div>
<div id="right"></div>
</div>
 <div id="middle"></div>
</body>
</html>

表示自己感觉这CSS写的很不好,虽然效果是实现了。各位大神,如果是你们写这个,会是什么样子的?或者你们觉得这个有哪里是需要改的(好啦好啦,写的跟翔一样是吧,我知道啦(¬_¬))。自己感觉选择器right里的CSS写的很没水准。还有middle里面的margin也不是很好(都不知道为什么是-800px,我只是一点点看着界面改出来的)……求大师指点啊

展开
收起
杨冬芳 2016-06-03 13:49:11 1985 0
1 条回答
写回答
取消 提交回答
  • IT从业

    写的这个例子,应该能给你很多启发
    screenshot
    screenshot

    2019-07-17 19:26:31
    赞同 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
零基础CSS入门教程 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载