亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

css中的浮動

Original 2019-03-07 21:52:41 176
abstract：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>css中的浮動</title> <style type="text/css"> *{margin:&nbs 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>css中的浮動</title>
		<style type="text/css">
			*{margin: 0px;padding: 0px;}
			.box1{height: 40px;width: 90px;background: gray;float: left;line-height: 40px;margin: 0px 1px;text-align: center;}
			.row{height: 40px;width: 120px;background: pink;display: none;}
			.clean{clear: both;}
			.box1:hover .row{display: block;}
			.box2{height: 30px;width: 460px;text-align: center;background: red;line-height: 30px;}
		</style>
	</head>
	<body>
		<div class="box1">HTML
			<div class="row">塊級元素</div>
			<div class="row">行內(nèi)元素</div>
			<div class="row">行內(nèi)塊元素</div>
		</div>
		<div class="box1">CSS
			<div class="row">內(nèi)聯(lián)樣式</div>
			<div class="row">內(nèi)部樣式</div>
			<div class="row">外聯(lián)樣式</div>
		</div>
		<div class="box1">JavaScript
			<div class="row">字符串</div>
			<div class="row">字典</div>
			<div class="row">元組</div>
		</div>
		<div class="box1">jQuery
			<div class="row">1</div>
			<div class="row">2</div>
			<div class="row">3</div>
		</div>
		<div class="box1">PHP
			<div class="row">1</div>
			<div class="row">2</div>
			<div class="row">3</div>
		</div>
		<div class="clean"></div>
		<div class="box2">*****************</div>
	</body>
</html>


Correcting teacher：天蓬老師Correction time：2019-03-08 09:38:39
Teacher's summary：在css中, 浮動是元素脫離文檔流, 然后重新排列的重要手段, 也是布局的前提之一, 但要注意, 浮動起來之后, 內(nèi)聯(lián)元素就支持寬高了

Release Notes

Popular Entries