Question

body{
	margin:0;
	padding:0;
	background-color:white;
	font-family:sans-serif;
	font-size:14px;
}

#wrapper{
	margin-top:10px;
	margin-bottom:50px;
	margin-left:auto;
	margin-right:auto;
	width:550px;
}

<!DOCTYPE html>
<html>
<head>
	<title>advanced website one</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="advanced1.css">
</head>
<body>
	<div id="wrapper">
		<header id="header">
			<img id="logo" src="images/logo.png" alt="logo image"/>
				<ul id="menu">
					<li><a href="#">Home</a></li>
					<li><a href="#">Portfolio</a></li>
					<li><a href="#">Gallery</a></li>
					<li><a href="#">Services</a></li>
					<li><a href="#">About</a></li>
					<li><a href="#">Contact</a></li>
				</ul>
		</header>
<content>				
	<h2>About Blue Micro</h2>
	<p>Blue Micro is meant for a site that doesn't necessarily need a huge amount of content. I've found that trying to put a small amount of text onto a large template ends up in a site that looks slightly off. So this template is for those that need a quick and simple site</p>
	<h2>Titles are H1 Tags</h2>
	<p>Try to include your keywords in the titles since they are what seach engines pick up, it's also a good idea to try to include those same keywords in the title as well (only one of two of your best ones).</p>
	<h2>Background Image</h2>
	<p>I debated using a fancy background for this template, but ultimately just decided to keep it blank. I did however create all the images with Alpha transparency, which means that regardless of what background you choose, it will always look good. So keep it white, or experiment with it if you please.</p>
	<h2>XHTML 1.1</h2>
	<p>This template validates as XHTML 1.1 - this is to ensure it'll work for many years to come, and it makes it really easy for you to modify.
	
	Try to include your keywords in the titles since they are what seach engines pick up, it's also a good idea to try to include those same keywords in the title as well (only one of two of your best ones).</p>
</content>
<footer>
<a href="#">free xhtml template by web page designer</a>

<!-- begin snippet: js hide: false console: true babel: false -->

</footer>
    </div>
</body>
</html>

我想在CSS中看到“看边框”边框，它不是那么难，但我是网络开发的新手。这个边界是线性渐变，有半径，我认为是内半径这是徽标图片logo image

border

Answer 1

.border {
    float: left;
    background-image: url(gradient_rectangle_back.png);
    background-repeat: repeat-x;
    background-color: #4586F1;
    width: 547px;
    margin-left: 14px;
    clear: both;
    margin: 0 auto 0 auto;
 }

您还需要下载此图片

http://www.quackit.com/html/templates/download/bryantsmith/bluemicro/gradient_rectangle_back.png

奇怪的CSS边界问题

1 个答案: