10-11

10-11公用css

/* CSS Document */
body {
    margin-top: 0px;
}
.box_zero{margin: 0 auto;
    padding: 0;
    height: 300px;
    width: 500px;
    background-color:#666;
}
.box_one{
    height: 100px;
    width: 100px;
    float: left;
    background-color: #F00;
}
.box_two{
    height: 100px;
    width: 100px;
    float: right;
    background-color: #F00;
}
.box {
    margin:auto;
    height: 110px;
    width: 1185px;
    background-color: #666;
}
.box1 {
    height: 60px;
    width: 1185px;
    background-color: #F00;
}
.box2 {
    height: 50px;
    width: 840px;
    background-color: #00F;
    float: right;
}
.box3 {
    height: 50px;
    width: 100px;
    border: solid 1px #FFF;
    float: left;
    background-color: #F90;
}
a{
    display:block;}

题目一:浮动

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>10.11One</title>
<link rel="stylesheet" type="text/css" href="作业10-11css.css" />
<style type="text/css">
</style>
</head>
<body>
<div class="box_zero">
  <div class="box_one"></div>
    <div class="box_two"></div>
</div>
</body>
</html>

题目二:元素转换

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>10.11Two</title>
<link rel="stylesheet" type="text/css" href="作业10-11css.css" />
</head>
<body>
<div class="box">
  <div class="box1"></div>
  <div class="box2">
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
    <div class="box3"><a href="苍爹秧歌"></a></div>
  </div>
</div>
</body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1 92
  • 1.佛在哪里? 佛不度人人自度,一切众生皆有如来智慧。佛是众生,父母就是佛,好好孝敬父母就是真正的学佛,带着感...
    雷一凡阅读 236评论 0 1
  • 今年春节旅行确定在天津和北京,被很多朋友嘲笑,说我们吸够了太原霾,要去帮助首都人民“霾头苦吸”。没想到我们人品爆发...
    林何凤阅读 432评论 0 0
  • 网络上,我们经常会看到一些教方法的文章,他们的标题里会说“最好的XXX方法”、“最完美的XXX方法”,文章中确实也...
    白鹤札记阅读 871评论 0 4
  • 2月20日,是美国President's Day总统日,早就计划要在这天去 Quincy昆西小镇。 昆西小镇被人们...
    山中花开阅读 676评论 0 0