4-3效果对吗
来源：4-3 编程练习
世界补丁
2017-11-26 00:47:19
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin: 0; padding: 0;}
.pro{
background-image: url(img/logo.png); width: 1903px; height: 4033px;
position: relative;
}
.gg1{
width: 200px;
height: 250px;
background-color: red;
font-family: "微软雅黑";
font-size: 18px;
position: fixed;
left: 0px;
top: 35%;
}
.gg2{
width: 200px;
height: 250px;
background-color: royalblue;
font-family: "微软雅黑";
font-size: 18px;
position: fixed;
right: 0px;
top: 35%;
}
</style>
</head>
<body>
<div class="pro">
<div class="gg1">
<h1 style="color: #FFFFFF;">web</h1>
<br>
<p style="color: #FFFFFF; font-size: 20px;">前端工程师</p>
<hr>
<br>
<br>
<br>
<p style="color: #FFFFFF; font-size: 20px;">职业路径></p>
</div>
<div class="gg2">
<h1 style="color: #FFFFFF;">JAVA</h1>
<br>
<p style="color: #FFFFFF; font-size: 20px;">工程师</p>
<hr>
<br>
<br>
<br>
<p style="color: #FFFFFF; font-size: 20px;">职业路径></p>
</div>
</div>
</body>
</html>
这里另外有个疑问：
1：为什么背景图片 不是适当的尺寸显示？那张图片明显已经右边移动了，我设置了宽高还是不行。
2：广告“WEB”这个字母怎么下移动一点？我的代码效果都是没有移动的，顺序去的。
1回答
-
好帮手慕糖
2017-11-26
你好，实现效果是没有问题的哦，1、那张图片明显已经右边移动了，这个是指效果图中的背景图片么？这个是没有问题的哦，是由于效果图中的宽度设置的有点小，这个是没有问题的哦，
2、可以个包裹它的盒子设置padding-top属性，也可以给本身设置margin-top属性。
祝学习愉快~
0
相似问题