1

我从 HTML 和 CSS 开始,我已经为我的朋友写了我的第一页。问题是我的代码似乎很糟糕,因为当我尝试更改一些东西时,整个页面几乎崩溃了。

我的页面地图:http: //i.stack.imgur.com/0U1lO.png

所以事情是这样的:

  1. 标志+导航菜单

这是代码:

#logo {
 margin-left: 15%; }

nav {
 float: left;
 margin-left: 10%;
 margin-top: 1%;
 font-weight: bold;
 vertical-align: central; }

a {
 text-decoration: none; }

nav ul {
 list-style-type: none; }

nav li {
 float: left;
 margin-right: 10px;

}
  1. 滑块是我认为唯一做得好的东西,因为我把它设置为左右边距:自动;
  2. 乐趣从这里开始:

新闻代码:

 .newsy {
 font-weight: 900;
 font-size: xx-large;
 margin-left: 15%;
 color: black; }


.image-box {
 position: relative;
 margin-left: 15%;
 width: 640px;
 height: 300px; }

 .image-box span {
     position: absolute;
     bottom: 0;
     left: 0;
     background: rgba(0,0,0, .5);
     color: white;
     padding: 15px;
 }


.community-box {
 margin-right: 15% ;
 float: right;
 }

.baner-box {
 float: right;
 width: 270px;
 height: 500px;
 margin-right: 15%; }

 .baner-box baner {
     margin: 40px;
 }

 .autor {
 border: solid 0px white;
 background-color: white;
 margin-left: 15%;
 padding: 10px;
 padding-left: 20px;
 width: 610px;
 background-color: white;
 position: relative;
 font-weight: bolder;
 font-size: 13px;
 font-kerning: normal; }

 .readmore {
 position:absolute;
 bottom: 0;
 right: 0;
 width: 90px;
 padding: 10px;
 padding-left: 20px;
 background-color: rgba(0,0,0, .9);
 color: white;

 }

当我尝试将它们从中心移到左边一点时,整个页面都崩溃了。此外,我的社区框(facebook、YT 和 twitter)设置不正确。

任何人都可以帮助我并说出我犯了什么错误吗?这真的很重要。问候。

PS告诉我你是否需要整个代码,我可以上传它的包。

4

1 回答 1

0

这可能会发生,因为宽度和高度的像素可能大于显示器的像素,所以我建议您以 % 的形式给出它,例如 .baner-box { float: right; 宽度:40%;高度:50%;保证金-权利:15%;}

可能适合你

于 2013-07-15T02:57:55.200 回答