css - 来自 css 的页面滞后

Question

我有一个模板，但是当我向下滚动页面时，它似乎真的很滞后我有一台 8 核计算机和 8gb 内存，所以我知道它进入了我的计算机。我有其他用户告诉我，我的网站运行缓慢。我改变了我的布局，一切正常，所以我知道它不是服务器。我更改了我的 html 布局并将我所有的 php 脚本放到一个新的 html/css 布局上并且工作正常没有滞后但我喜欢这个布局......

这是我的 css，我认为这是问题所在

html
{
    background: url(../images/background.png);
    background-color: transparent;
    overflow-y: auto;
}

body {
    width: 1000px;
    margin: auto;
    padding: 0;
    text-align: center;
    color: #000000;
    font-family: verdana;
    font-size: 0.7em;
}

div.container
{   
    width:100%;
    height:100%;
    position:absolute;
    margin:auto;
}
div.holder
{
    width:990px;
    background-color:#d7f7f7;
    height:100%;
    margin:auto;
    margin-top:0px;
    background-image:url('../images/swampertbackground.png');
    background-repeat:no-repeat;
    background-position:bottom center;
}
#container{
    height: 100%;
    width: 1000px;
    background-color: #d7f7f7;
    position: fixed;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    border-left: solid #25a5a6 2px;
    border-right: solid #25a5a6 2px;
    overflow-y: auto;
    overflow-x: auto;
}
div.banner
{
    height:125px;
    width:700px;
    display:block;
    position:absolute;
    margin-top:2px;
    margin-left:140px;
    background-color:#FFF;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border: solid #25a5a6 1px;
    background-image:url('../images/banner.png');
    box-shadow: 3px 3px 3px #4b8384;
}

ul , li
{
    margin:0px;
    padding:0px;
    list-style:none;

}
div.left_navigation
{
    position:absolute;
    margin-left:5px;
    margin-top:150px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    width: 152px;
}

div.left_navigation2
{
    position:absolute;
    margin-left:5px;
    margin-top:300px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

div.left_navigation3
{
    position:absolute;
    margin-left:5px;
    margin-top:400px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.left_navigation4
{
    position:absolute;
    margin-left:5px;
    margin-top:500px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.left_navigation5
{
    position:absolute;
    margin-left:5px;
    margin-top:600px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

div.left_navigation6
{
    position:absolute;
    margin-left:5px;
    margin-top:700px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

li.header
{
    width:150px;
    height:14px;
    background-color:#54c0c1;
    border:1px #188c8d solid;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    background-image:url('../images/header.png');
    border-left:2px #188c8d solid;
    color:#FFFFFF;
    font-weight:900;

}
li.links
{
    width:150px;
    height:16px;
    background-color:#c1f9fa;
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    color:#074647;

}

li.links:hover
{
    background-color:#FFFF00;
    color:#296584;
    font-weight:bold;
    text-shadow: 1px 2px 2px #0096ff;

}
li.footer
{
    width:150px;
    height:9px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    background-image:url('../images/header.png');
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
}
div.centerboxholder
{   
    position:absolute;
    top:150px;
    margin-left:165px;
    width:661px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}
div.centerbox
{   
    position:absolute;
    width:661px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px; 
}
li.chead
{
    width:660px;
    height:14px;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    background-image:url('../images/header.png');
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    border:1px #188c8d solid;
    color:#FFFFFF;
    font-weight:900;
    box-shadow: 0px 0px 3px #4b8384;
}

li.ccontent
{
    width:659px;
    background-color:#c1f9fa;
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    color:#000;
    font-size:0.9em;
    border-right:1px #188c8d solid;
    box-shadow: 3px 3px 3px #4b8384;
}
li.cfoot
{
    width:659px;
    height:9px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
    background-image:url('../images/header.png');
    border-bottom:1px #188c8d solid;
    border-left:2px #188c8d solid;
    border-right:1px #188c8d solid;
    box-shadow: 3px 3px 3px #4b8384;
}

div.right_navigation
{
    position:absolute;
    margin-left:834px;
    top:150px;
    box-shadow: 3px 3px 3px #4b8384;
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    border-bottom-left-radius:7px;
    border-bottom-right-radius:7px;
}

table
{
    padding:0px;
    margin:0px;
    border: 0px;
    font-size:0.9em;
    font-weight:bold;
    color:#000;
}

td
{
    border:1px #188c8d solid;
    width:200px;
    text-align:center;
}

#textfield
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
}
#gender
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
    width:110px;
    padding:0px;
}
#gendertop
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;

}
#genderbottom
{
    color: #000000;
    font-family: verdana;
    font-size:1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
}

#button
{
    background-color:Transperent;
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    width:100px;
    padding-top:0px;
    margin:0px;
    height:16px;
    padding-bottom:5px;
}
#Avatar
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border:1px #188c8d solid;
    border-radius:5px;
    width:110px;
}
#changer
{
    color: #000000;
    font-family: verdana;
    font-size: 1em;
    font-weight: bold;
    background-color:#e2fffc;
    border-bottom:1px #188c8d solid;


}

li.topper
{   
    height:12px;
    border:1px #188c8d solid;
    border-top-left-radius:5px;
    border-top-right-radius:5px;
    background-image:url('../images/header.png');
}
li.bottomer
{

    border:1px #188c8d solid;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
    background-image:url('../images/header.png');
    height:12px;
}

#button:hover
{
    cursor:pointer;
}
a:link { color:#296584; text-decoration:none;display:block;}
a:visited { color:#296584; text-decoration:none;}
a:hover { color:#296584; text-decoration:none;text-shadow: 1px 2px 2px #0096ff;}
a:active {color:#296584; text-decoration:none; background-color:}

那个 css 中有什么东西会使其滞后吗？

这里说 http://jigsaw.w3.org/css-validator/validator?uri=pokemontoxic.net&profile=css21&usermedium=all&warning=1&vextwarning=&lang=en

我有 81 个错误，这些是大错误吗？

Answer 1

使用此工具对您的 css 进行压力测试，作者在大元素上遇到了边框半径问题:http://andy.edinborough.org/CSS-Stress-Testing-and-Performance-Profiling