CSS`clear:both;`body in body

时间:2017-08-14 17:04:49

标签: html css css-float

我正在阅读 HTML和CSS ,我制作了以下代码。

			body { 
				width: 752px;
				font-family: Arial, Verdana, sans-serif;
				color: #665544;
			}
			div {
				border: 1px solid #665544;
			}
			p {
				width: 230px;
				float: left;
				margin: 10px;
			}
			.clear {
				clear: both;
			}
<!DOCTYPE html>
<html>
	<head>
		<title>Parent Float - Problem</title>
	</head>
	<body>
		<h1>The Evolution of the Bicycle</h1>
		<div>
			<p class="one">In 1817 Baron von Drais invented a walking machine that would help him get around the royal gardens faster.</p>
			<p class="two">The device know as the Draisienne (or "hobby horse") was made of wood, and propelled by pushing your feed on the ground in a gliding movement.</p>
			<p class="three">It was not seen a suitable for any place other than a well maintained pathway. </p>
			<p class="four clear">In 1865, the velocipede (meaning "fast foot") attached pedals to the front wheel, but its wooden structure made it extremely uncomfortable.</p>
			<p class="five>In 1870 the first all-metal machine appeared. The pedals were attached directly to the front wheel. 
			<p class="six">Solid rubber tires and the long spokes of the large front wheel provided a much smoother ride than its predecessor.</p>
		</div>
	</body>
</html>

现在,我将CSS规则clear: both;应用于类clear的段落。 但是,我可以看到左侧没有触及body容器内的任何其他元素,但为什么它仍然触及右侧的段落five

编辑 我正在阅读的这本书没有提及只适用于前面元素的clear -

enter image description here

0 个答案:

没有答案