Question

当我拉伸CSS中的背景时，填充会创建一个奇怪的黑色线条，我添加的填充越多，黑色线条就越大，这里的图像是：

http://i61.tinypic.com/2ia7rlv.jpg

以下是代码：

CSS：

＆＃13;

/* reset browser styles */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

/* end of browser styles */

@import url(http://fonts.googleapis.com/earlyaccess/notosanshebrew.css);

#logo {
	padding-right: 10px;
	padding-top: 10px;
}

nav {
	background: rgba(0,0,0,.7);
	padding: 2px;}
nav li {
	display: inline;
	padding: 0 20px;
}
nav ul {
	list-style-type: none;
}
nav ul a{
	text-decoration: none;
	color: white;
}

nav a:hover {
	color: rgb(207, 207, 207);
}

＆＃13;

<!doctype html>
<html dir="rtl" lang="he-IL" prefix="og: http://ogp.me/ns#">
	<head>
		<meta charset="utf-8">
		<title>SD עיצובים</title>
		<link href="css/style.css" rel="stylesheet">
	</head>
	<body>
		<div id="wrapper">
			<header div="mainHeader">
				<nav div="mainNav">
					<ul>
						<img id="logo" src="images/title5.png"/>
						<li><a href="index.html">דף הבית</a></li>
						<li><a href="about.html">אודות</a></li>
						<li><a href="jewelery.html">תכשיטים</a></li>
						<li><a href="contact.html">צור קשר</a></li>
					<ul>
				<nav>
			<header>
		</div>
	</body>
</html>

＆＃13;

Answer 1

您的代码中有拼写错误。不是使用<nav>关闭</nav>，而是在<ul>元素下打开一个新的。{/ p>

Answer 2

您缺少ul，nav和header元素中的结束标记。浏览器将其视为您正在创建新元素。

正确的代码：

<div id="wrapper">
            <header div="mainHeader">
                <nav div="mainNav">
                    <ul>
                        <img id="logo" src="images/title5.png"/>
                        <li><a href="index.html">דף הבית</a></li>
                        <li><a href="about.html">אודות</a></li>
                        <li><a href="jewelery.html">תכשיטים</a></li>
                        <li><a href="contact.html">צור קשר</a></li>
                    </ul>
                </nav>
            </header>
        </div>

工作解决方案：

http://jsfiddle.net/xL5c4t6y/

填充在我的<ul> </ul>上创建了奇怪的黑线

2 个答案: