为什么简介和mainpart在html/css中只做一个部分
这里有一点我的代码，我想有2个不同的部分结束我的网站，但我不能这样做 也许这是一个与之相关的问题，我正在努力理解其中的区别 有什么建议吗为什么简介和mainpart在html/css中只做一个部分,html,css,Html,Css,这里有一点我的代码，我想有2个不同的部分结束我的网站，但我不能这样做 也许这是一个与之相关的问题，我正在努力理解其中的区别 有什么建议吗 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Welcome Bootsworld</title> <link rel="stylesheet"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Welcome Bootsworld</title>
<link rel="stylesheet" type="text/css" href="bootsworld.css">
</head>
<body>
<div id="page" class="divborder">
<header id="pageheader">
<nav id="primarynav">
<ul>
<li><a href="#">Site map</a></li>
<li><a href="#">Privacy policy</a></li>
<li><a href="#">Accessibility</a></li>
</ul>
</nav>
<nav id="title">
<h1>BOOT</h1><h2>WORLD</h2>
</nav>
<nav id="secondnav">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">SHOP</a></li>
<li><a href="#">NEWS</a></li>
<li><a href="#">ABOUT US</a></li>
<li><a href="#">CONTACT US</a></li>
<li><a href="#">SUBSCRIBE</a></li>
</ul>
</nav>
</header>
<div id="introduction" class="divborder">
<img src="boots.png" width="500" height="350" alt="boots"/>
<h2>Welcome to boot world</h2>
<p class="intro">BootWorld is the largest online footwear retailer in the UK.<a href="#">Our shop</a> always has stock of the latest designer footwear at the most competitive prices. Want to know more about us or our products, why <a href= "mailto:#">not send us a message.</a></p>
</div>
<div id="mainpart" class="divborder">
<h2>NEW IN THE SHOP</h2>
<article class= "news">
<h3>CLASSIC COWBOY BOOTS</h3>
<p>Stand out from the crowd in a pair of classic cowboy boots. Available for Ladies and Gents from only <mark class="black">£49.99</mark></p>
<h3>MILITARY BOOTS</h3>
<p>Hard-wearing Men's military boots, gsuaranteed to withstand all weathers. From only <mark class="black">£69.99</mark></p>
<h3>ROMAN SANDALS</h3>
<p>Get ready for summer with some stylish roman sandals. From only <mark class="black">£39.99</mark></p>
<h3>OFFICE SHOES</h3>
<p>You don't have to wear boring shoes to the office. Check out our new stock of Ladies and Gents fashionable office shoes from only <mark class="black">£44.99</mark></p>
</article>
<aside id="latestnews">
<h3>Latest News</h3>
<p>Our seasonal sale has kicked off again! make sure you stop by our online shop to pick up a bargain.</p>
<footer>Posted by: Joe</footer>
<h3>Subscribe</h3>
<p>Sign up to our newsletter and receive exclusive offers by email weekly.</p>
<form>
<fieldset>
<legend>SIGN UP NOW!</legend>
<p>
<label for="yourname">Your name</label><br/>
<input type="text" name="yourname" id="yourname"size="20"/>
</p>
<p>
<label for="emailaddress">email address</label><br/>
<input type="text" name="emailaddress" id="emailaddress"size="20"/>
</p>
<button onclick="myFunction()">Sign Up</button>
</fieldset>
</form>
</aside>
</div>
</div>
<footer id="pagefooter">
<h3>OUR ADDRESS:</h3>
<p>Malet Street,<br/> London, WC1E 7HX</p>
</footer>
</div>
</body>
</html>
css非常凌乱，很难阅读，但这是你的问题。首先，你不想在你的
h2display:inline旁边的浮动dispaly:inline块\latestnews.news在我的网站的末尾有2个不同的部分，但我不能这样做。你能更具体地说明你想要什么和得到什么吗？如果这是有关你的CSS你需要提供相关的类。我有2个部分，我想添加在我的主要部分的权利。让我发布我所有的实际网页。
body{
font-family: Arial, Verdana, Geneva, sans-serif;
width: 90%;
margin: auto;
}
h1,h2{
display: inline;
color: #016008;
}
h1{
font-size: 60px;
}
h2{
font-size: 40px;
}
li{
display: inline;
}
a{
color:#016008;
text-decoration: none;
}
#secondnav a{
color:#016008;
text-decoration: none;
background-color: #dddddd;
border: 1px;
}
aside{
color:#016008;
text-decoration: none;
background-color: #dddddd;
float: right;
}
form{
background-color: white;
margin: 0px;
}
legend{
color: #3e3e3e;
font-weight: bold;
}
#primarynav ul{
color: #016008;
text-align: right;
}
#secondnav{
display: block;
text-align: justify;
}
#mainpart h2{
color: #3e3e3e;
}
#latestnews h3{
color: #3e3e3e;
}
#latestnews footer{
float: right;
color: #3e3e3e;
}
#latestnews p{
text-decoration: underline;
}
#suscribe h3{
color: #3e3e3e;
}
#pagefooter{
background-color: #dddddd;
color:#3e3e3e;
}
img{
border:1px solid grey;
float: left;
}
#introduction{
margin-top: 0px;
float: right;
}
.news{
background-color: #dddddd;
width: 65%;
padding:2px 7px 4px 7px;
margin: 2px 2px 2px 2px;
text-align: justify;
color:#016008;
}
.divborder{
border: 1px solid grey;
box-shadow: 1px;
margin: 10px;
}
div{
text-align: justify;
padding:2px 7px 4px 7px;
margin: 10px;
}
#pagefooter{
padding:2px 7px 4px 7px;
}
#latestnews{
display: inline;
width:30%;
}
#suscribe{
display: inline-block;
width:30%;
}
mark.black{
color: black;
background: none;
font-weight: bold;
}
img{
margin:10px;
}
#mainpart{
background-color: blue;
}
.news {
background-color: #dddddd;
width: 65%;
padding: 2px 7px 4px 7px;
margin: 2px 2px 2px 2px;
text-align: justify;
color: #016008;
display: inline-block;
}
#latestnews {
display: inline-block;
width: 30%;
}
aside {
color: #016008;
text-decoration: none;
background-color: #dddddd;
/* float: right; */
}