【html作业贴】网页设计敲代码ing【唐光明吧】

唐光明吧关注：2,163贴子：210

5回复贴，共1页

【html作业贴】网页设计敲代码ing

<!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>两个行内元素</title>
<style type="text/css">
span{
background-color:#a2d2ff;
text-align:center;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
padding:10px;
}
span.left{
margin-right:30px;
background-color:#a9d6ff;
}
span.right{
margin-left:40px;
background-color:#eeb0b0;
}
</style>
</head>
<body>
<span class="left">行内元素1</span><span class="right">行内元素2</span>
</body>
</html>

送TA礼物

1楼2015-04-27 16:29回复

<title>两个块元素</title>
<style>
div{
background-color:#a2d2ff;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding:10px;
}
</style>
</head>
<body>
<div style="margin-bottom:50px;">块元素1</div>
<div style="margin-top:30px;">块元素2</div>
</body>
</html>

2楼2015-04-27 16:29

<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>父子块的magin</title>
<style type="text/css">
div.father{
background-color:#fffebb;
text-align:center;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
padding:10px;
border:1px soild #000000;
}
div.son{
background-color:#a2d2ff;
margin-top:30px;
margin-bottom:0px;
padding:15px;
border:1px dashed #004993;
}
</style>
</head>
<body>
<div class="father">
<div class="son">子div</div>
</div>
</body>
</body>
</html>

3楼2015-04-27 16:30

<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>设置父块的高度</title>
<style type="text/css">
div.father{
background-color:#fffebb
text-align:center;
font-family:Arial, Helvetica,sans-serif;
font-size:12px;
padding:10px;
border:1px soild #000000;
height:40px;
}
div.son{
background-color:#a2d2ff:
margin-top:30px:margin-bottom:0px:
padding:15px;
border:1px dashed #004993;
}
</style>
</head>
<body>
<div class="father">
<div class="son">子div</div>
</div>
</body>

4楼2015-04-27 16:30

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>margin设置为负数</title>
<style type="text/css">
span{
text-align:cneter;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
padding:10px;
border:1px dashed #000000;
}
span.left{
margin-right:30px;
background-color:#a9d6ff;
}
span.right{
margin-left:-53px;
background-color:#eeb0b0;
}
</style>
</head>
<body>
<span class="left">行内元素1</span><span class="right">行内元素2</span>
</body>

5楼2015-04-27 16:30

<!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>无标题文档</title>
<style type="text/css">li{float:left;
list-style:none;
margin:0 10px;
background-color:#900;
}
div{width:1000px;
margin:auto;
float:none;
}
div.daohang{
width:auto;
margin:auto;
height:25px;
background-color:#900;
float:left;
}
li:hover{
background-color: #FFF;}
</style>
</head>
<body><div>
<div class="daohang">
<a href="http://www.695m.com/"><li>校园新闻
</li>
</a><li>学校概况
</li><li>机构设置
</li><li>教育教学
</li><li>科学研究
</li><li>招生就业
</li>
</div>
</div>
</body>
</html>

6楼2015-08-05 10:17

扫二维码下载贴吧客户端

下载贴吧APP
看高清直播、视频！

贴吧热议榜

5回复贴，共1页

<返回唐光明吧

发表回复

发贴请遵守贴吧协议及“七条底线”贴吧投诉

内容:

使用签名档查看全部

发表

保存至快速回贴

日	一	二	三	四	五	六

【html作业贴】网页设计敲代码ing

登录百度账号

扫二维码下载贴吧客户端