DIV+CSS这三处应该如何写代码呢，谢谢
1处，文字加背景那个黑条，用CSS如何写呢，谢谢2.处，一个背景橙色，上面文字加超链接，这个怎么写呢，还有就是布局到那个右下角落。3.那背景一直在变换颜色。如何实现呢.4...
1 处， 文字加背景那个黑条，用CSS如何写呢，谢谢
2.处，一个背景橙色，上面文字加超链接，这个怎么写呢，还有就是布局到那个右下角落。
3.那背景一直在变换颜色。如何实现呢.
4.就是那个4个图片布局一行，然后下面有文字带超连接，谢谢，如何写呢，谢谢。 展开
2.处，一个背景橙色，上面文字加超链接，这个怎么写呢，还有就是布局到那个右下角落。
3.那背景一直在变换颜色。如何实现呢.
4.就是那个4个图片布局一行，然后下面有文字带超连接，谢谢，如何写呢，谢谢。 展开
4个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona//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=gb2312" />
<title></title>
<meta http-equiv="Content-Language" content="en-us" />
<style>
#container {
width: 800px;
margin: 0 auto;
}
#header {
width: 100%;
background: #000;
color: #fff;
padding: 10px 0 10px 40px;
}
#content_area .item {
float: left;
border: 1px solid #aaa;
margin-left: 10px;
margin-top: 10px;
text-align: center;
}
#content_area .cleaner {
clear: both;
}
#content_area .item img {
display: block;
width: 180px;
height: 180px;
}
#content_area .item a {
padding: 0px;
margin: 0px;
}
#content_area .item .btn {
margin: 0px;
padding: 0px;
width: 100px;
border: 1px solid silver;
background: #f0f;
}
#more {
width: 100px;
text-align: center;
padding: 4px 0;
background: #ffa;
border: 1px solid silver;
float: right;
}
</style>
</head>
<body>
<div id="container">
<div id="header">女款推荐
</div>
<div id="content_area">
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="cleaner"></div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="cleaner"></div>
</div>
<div id="more">
<a href="">所有宝贝</a>
</div>
</div>
</body>
</html>
自己套一下吧！里面的<br/>还可以改进。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=gb2312" />
<title></title>
<meta http-equiv="Content-Language" content="en-us" />
<style>
#container {
width: 800px;
margin: 0 auto;
}
#header {
width: 100%;
background: #000;
color: #fff;
padding: 10px 0 10px 40px;
}
#content_area .item {
float: left;
border: 1px solid #aaa;
margin-left: 10px;
margin-top: 10px;
text-align: center;
}
#content_area .cleaner {
clear: both;
}
#content_area .item img {
display: block;
width: 180px;
height: 180px;
}
#content_area .item a {
padding: 0px;
margin: 0px;
}
#content_area .item .btn {
margin: 0px;
padding: 0px;
width: 100px;
border: 1px solid silver;
background: #f0f;
}
#more {
width: 100px;
text-align: center;
padding: 4px 0;
background: #ffa;
border: 1px solid silver;
float: right;
}
</style>
</head>
<body>
<div id="container">
<div id="header">女款推荐
</div>
<div id="content_area">
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="cleaner"></div>
<div class="item">
<img src="" />
<a href="#">aadgjalgjladjlgdjka</a><br />
<a href="#" class="btn">一口价</a>118.0元
</div>
<div class="cleaner"></div>
</div>
<div id="more">
<a href="">所有宝贝</a>
</div>
</div>
</body>
</html>
自己套一下吧！里面的<br/>还可以改进。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
先说下第一处，第一处可以定义个H标签，里面写上文字，然后用类给H标签打一个背景让他平铺，其他属性也可以设置。
2处也是同样的，设置下背景颜色，让那个右浮动。
中间的话，图片和文字放在DIV块里，全部左浮动。
下面的链接用ul li a 写，设置ul以行显示，a以块显示，打上背景，li控制边距。
总体布局标签我大概写下。
<div id="container ">
<h1>女款推荐</h1>
<div> <!-这里放图片 上面是4个--></div>
<ul><li><a>这里放链接</a></li> <!--这里一共4个套着a的li --> </ul>
<a>最后的那个链接</a>
</div>
上面的我没试可能有些不对的地方。我觉得CSS还是自己边学边试的好，直接套答案不利于学习.
2处也是同样的，设置下背景颜色，让那个右浮动。
中间的话，图片和文字放在DIV块里，全部左浮动。
下面的链接用ul li a 写，设置ul以行显示，a以块显示，打上背景，li控制边距。
总体布局标签我大概写下。
<div id="container ">
<h1>女款推荐</h1>
<div> <!-这里放图片 上面是4个--></div>
<ul><li><a>这里放链接</a></li> <!--这里一共4个套着a的li --> </ul>
<a>最后的那个链接</a>
</div>
上面的我没试可能有些不对的地方。我觉得CSS还是自己边学边试的好，直接套答案不利于学习.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
用ff浏览器，安装firebug插件，右键点击你想查看css的位置，点击查看元素
右下角就会出现选中元素的样式了
祝你好运！
右下角就会出现选中元素的样式了
祝你好运！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
1.切一像素的竖条当作背景
2.psd中先把字隐藏，然后切图片做背景
3，同2
4，用ul li{｝和span标签一起用
2.psd中先把字隐藏，然后切图片做背景
3，同2
4，用ul li{｝和span标签一起用
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
