正文
css样式美化div盒子,css怎样给盒子加底色
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
CSS样式如何实现Logo立体盒子效果
我们简单的将HTML写成这样:
div id="container"
img id="logo" src="logo.png" alt="Lee Munroe" //divCSS样式可能会是这个样子的:
body{background:#999;}
#container{
width:960px;
background:#fff;
margin:20px auto;
padding:10px;}下面是一个效果预览：
设置为相对定位，当我们定位logo的时候，我们希望它的位置是相对于容器的，因此使用相对定位：
#container{
width:960px;
background:#fff;
margin:20px auto;
padding:10px;
position:relative;}将它定位到盒子的外面现在你需要做的就仅仅是定位logo，将其水平定位，让它从容器中突出出来。#logo{position:absolute;
相关问答
Q1: css样式 div两个盒子上下叠加如下图怎么写啊？
如果大盒子套小盒子，可以这样：
div style="position:relative; width:400px; height:300px; background-color:yellow"
div style="position:absolute; bottom:0; left:50px; width:300px; height:150px; background-color:red"/div
/div
如果两个盒子是独立的，则可以这样：
div style="width:400px; height:300px; background-color:yellow"/div
div style="position:relative; top:-150px; left:50px; width:300px; height:150px; background-color:red"2/div
其实有N多种方式实现，上述只是其中的一两种
Q2: div+css如何让一个div块不受整体的css样式控制
1、新建一个html文件，命名为test.html。
2、在test.html文件内，使用css对div进行初始化，设置其内外边距都为0，并让div浮动向左。
3、在test.html文件内，创建一个div，并设置其class属性为xx，用于下面定义其css样式。
4、在test.html文件内，使用css设置类名为xx的div样式，设置其宽度、高度都为300px，背景颜色为红色。
5、在test.html文件内，在上面div的内部，再创建一个div，并设置其类名为ss。
6、在test.html文件内，使用css设置类名为ss的div样式，设置其高宽为100px，背景颜色为白色，上边距为100px，左边距为100px。
Q3: css+div美化，会的进
找人教,比较困难,真正的高手都忙着....你可以找个你觉得合你口味的网页,把里面的文字给改了,
Q4: 网页设计，用div盒子制作网页，要怎么样才能把绿色盒子放到红色盒子下面，把绿色盒子的图片当做背景来
没看明白咋回事 ，绿色在红色 下面 ，这不太简单了 ，现在给你做个演示 你看看 ， 你只要做 两个 div , css设置好 长 和高 。图片做 背景 代码是 background-image:url("图片路径地址/图片名称.jpg"); 下面是 我演示图片的 代码 。绿色在红色下面 。 就说到这里，不满意，不会做 ？那你等等其他人的回答吧 解决 你这个问题，发十元红包 即可。想做就私信我， 其实我觉得你这个问题 没哪么简单 ，你可能 描述问题都 没有描述对 。应该你想问的是 ，绿色在红色的 后面 。而不是下面 。 绿色在 红色后面，没有必要的吗 。红色做个 图片背景 ，不也是 一样的吗 。何必要搞得哪么复杂吗？ 如果你想让 div 有层次 那要用 ，定位的方法。如果你够聪明 看我现在和你说的 你就应该 明白了 。
html
head
titlediv测试/title
style type="text/css"
body{
width:500px;
margin:0 auto;
}
.red{
background:red;
width:500px;
height:180px;
}
.green{
background:green;
width:500px;
height:300px;
}
/style
/head
body
div class="red"
红色
/div
div class="green"
绿色
/div
/body
/html
Q5: CSS+DIV写盒子模型图
html
head
title/title
style type="text/css"
!--
#div {
background-color:#CCCCCC; /*这是div背景色！可以不要~这里仅便于你区别*/
margin-top: 20px; /*div离页面面顶部的距离为20像素*/
margin-left: 50px; /*div离页面面左端的距离为50像素*/
/*这里若设置了顶部和左部就不用设置右和下了~因为2个位置就能把div定位
margin-right: 30px;
margin-bottom: 40px; */
border:#0099FF 10px solid; /*div边框为10像素*/
padding-top: 20px; /*内容与div边框顶部的距离为20像素！这里“内容”的位置=20+10+20的像素*/
padding-left: 90px; /*内容与div边框左边的距离为90像素！这里“内容”的位置=50+10+90的像素*/
padding-right: 30px; /*同上*/
padding-bottom: 50px; /*同上*/
}
--
/style
/head
body
div id="div"此处显示 id "div" 的内容这些内容！其实是显示在div的center里！是个隐藏的框框~需要去理解/div
/body
/html
