gpt4 book ai didi

html - 使用多个 DIV 会影响页面性能吗?

转载 作者:搜寻专家 更新时间:2023-10-31 23:12:39 27 4
gpt4 key购买 nike

我是编码和 CSS 领域的新手。我已经整理了一个页面,但是我不确定我是否过度使用了 div 标签,它是否会影响页面的性能,以及我是否应该将 float 清除为它自己的 div 标签,例如

#content {

clear: both;

}

我已经包含了下面的全部代码

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="en-us" />

<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />

<title>Example</title>

<base href="" />

<link rel="icon" type="image/png" href="" />

<link rel="stylesheet" type="text/css" href="" />

<style type="text/css" media="all">

* {

margin: 0;
padding: 0;

}


body {

font-family: arial, verdana, sans-serif;
font-size: 0.8em;

}


#wrapper {

/* background-image: url('images/bg-inner-page.gif'); */
background-color: #808080;
height: 200px;

}

#innerwrapper {

width: 960px;
overflow: auto;

}

#header {



}

#logo {

float: left;
margin-top: 20px;
margin-left: 50px;
background-color: gray;

}

#topnav {

float: left;
margin-top: 50px;
margin-left:30px;
color: #ffffff;

}

#topnav ul {

word-spacing: 10px;

}

#topnav ul li {

list-style-type: none;
display: inline;

}

#content {

clear: both;

}

#innercontent {

float: left;
margin-top: 100px;
margin-left: 225px;
margin-bottom: 20px;
width: 400px;

}


#rightcol {

float: left;
margin-top: 125px;
margin-left: 50px;
width: 200px;

}


#footer {

background-color: gray;

}


</style>

</head>

<body>
<div id="wrapper">
<div id="innerwrapper">

<div id="header">
<div id="logo"><img src="images/logo.gif" width="150" height="96" alt="logo" /></div>

<div id="topnav">
<ul>
<li>home</li>
<li>about</li>
<li>browse</li>
<li>faq</li>
<li>contact</li>
</ul>
</div>

</div>

<div id="content">
<div id="innercontent">

Lorem ipsum dolor sit amet, at elementum neque vestibulum sollicitudin semper neque, vitae metus. Nibh ligula mi. Faucibus rutrum elit turpis, nec congue quam ipsum felis neque et, wisi amet, architecto eros congue. Maecenas suspendisse tellus arcu eget pharetra, rhoncus aenean sapien morbi nec arcu, vivamus aliquet lorem amet at, vestibulum purus sociis varius id. Imperdiet id magnis turpis beatae aliquet, vestibulum dolor nec eget eu cras lobortis, vel rerum, risus sed et, libero et non eros commodo. Taciti eu leo sollicitudin malesuada, nibh duis amet aenean, odio aptent ultrices. Tristique morbi nunc ullamcorper ut curabitur. Et a in ut sem varius, sem rutrum vehicula sem sed, at diam amet erat vel. Et sit in ante felis vitae sit.

Quam eget sed elit natoque velit, enim mauris mauris urna, integer amet tellus illo ipsum, dolor fermentum cursus enim mollis tristique porttitor. Non dignissim. Sit ligula leo tincidunt, justo ut ut placerat quisque non, risus nonummy. Ultrices mauris congue aliquam aliquam felis, at placerat, amet vestibulum dictumst pellentesque iaculis risus. Sem sed impedit nullam ultrices lorem aliquam, nulla tellus consequatur in ornare magna. Viverra amet pede in in ornare eu, id arcu. Justo mus suspendisse praesent et, amet mattis convallis ullamcorper felis, fermentum nibh at ac, ullamcorper ipsum auctor et maecenas, aliquam molestiae in qui. Massa elit suspendisse penatibus molestie libero dolor, non leo vitae, sollicitudin a, platea tristique iaculis, tortor augue non est. Ante rutrum quis pellentesque lacinia convallis non, vestibulum nibh nunc luctus nibh a, in amet, iaculis dui ornare pede laoreet eu. Cursus integer vehicula quis, justo eget purus mattis donec vestibulum nunc, nunc vel eros lectus.
</div>
</div>

<div id="rightcol"><img src="http://htmldog.com/r/logo.gif" width="140" height="91" alt="html" /></div>
</div>

<div id="footer">footer</div>
<div>
</body>
</html>

最佳答案

不要担心由于许多 div 而导致的性能问题。除非您使用数百个 div(例如,在某些浏览器上模拟圆 Angular 边框),否则网页的瓶颈将是 inet 连接。

关于html - 使用多个 DIV 会影响页面性能吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6106219/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com