html中网页整个居中，两边留白的代码是什么？ 【html】怎么做到某些段落居中，两边留白
html\u4e2d\u7f51\u9875\u6574\u4e2a\u5c45\u4e2d\uff0c\u4e24\u8fb9\u7559\u767d\u7684\u4ee3\u7801\u662f\u4ec0\u4e48\u5728html\u4e2d\u4f7f\u6240\u6709\u7684\u5143\u7d20\u90fd\u5267\u4e2d\u663e\u793a\u4e24\u8fb9\u7559\u767d\u7684\u6700\u7b80\u5355\u7684\u5b9e\u73b0\u65b9\u6cd5\u5c31\u662f\u7ed9\u6574\u4f53\u7684\u5bb9\u5668\u8bbe\u7f6e\u4e00\u4e2a\u5267\u4e2d\uff0c\u4f8b\u5982\u8bbe\u7f6emargin:0 auto\u3002
\u5de5\u5177\u539f\u6599\uff1a\u7f16\u8f91\u5668\u3001\u6d4f\u89c8\u5668
1\u3001\u5b9e\u73b0\u7b80\u5355\u7684\u8ba9\u9875\u9762\u6240\u6709\u7684\u5143\u7d20\u7684\u90fd\u5267\u4e2d\u663e\u793a\u7684\u65b9\u6cd5\u5982\u4e0b\uff1a
\u8fd9\u662f\u5c45\u4e2d\u663e\u793a\u7684\u4e00\u6bb5\u6587\u5b572\u3001\u7ed9\u5bb9\u5668div\u8bbe\u7f6emargin\u7684\u503c\uff0c\u5bfc\u81f4\u5176\u4f1a\u5c45\u4e2d\u663e\u793a\u5728body\u4e2d\uff0c\u6548\u679c\u5982\u4e0b\uff1a
\u6bb5\u843d\u4e00...
\u6bb5\u843d\u4e8c...
\u6bb5\u843d\u4e09...
在html中使所有的元素都剧中显示两边留白的最简单的实现方法就是给整体的容器设置一个剧中，例如设置margin:0 auto。
工具原料：编辑器、浏览器
1、实现简单的让页面所有的元素的都剧中显示的方法如下：
<body >
<div style="border: 1px solid #000000; width: 300px; height: 500px;margin: 0 auto;">
<span>这是居中显示的一段文字</span>
</div>
</body>
2、给容器div设置margin的值，导致其会居中显示在body中，效果如下：
绛旓細涓嬮潰璇翠袱绉嶅湪灞忓箷姝ｄ腑锛堟按骞灞呬腑+鍨傜洿灞呬腑锛夌殑鏂规硶锛屾斁涓婄ず鑼冪殑html浠ｇ爜锛/p>?/body>?/html>?2銆佹按骞冲眳涓疄渚 DIV鎬庝箞浣夸腑闂寸殑涓滆タ灞呬腑锛1銆佸湪DIV鏍囩瀵逛腑鍐欏叆鐨勬鏂囨爣绛剧殑HTML涓p>/p>銆2銆佺劧鍚庢垜浠皢p璁剧疆涓哄楂樺害,鎴戜滑闇瑕佹敞鎰忕殑鏄,濡傛灉鎮ㄤ笉璁剧疆榛樿鍊肩殑瀹藉害涓100%鍝,鎵浠ュ畠灏嗗～鍏鏁翠釜椤甸潰銆3...
绛旓細棣栧厛锛屽皢杩欏叚涓爣绛炬斁鍦ㄤ竴涓潡绾ф爣绛惧唴锛堝凡缁忔湁浜嗗氨涓嶇浜嗭級锛涘叾娆★紝璁剧疆li鏍囩鐨margin:10px 5px;(鍏蜂綋鍊艰嚜琛岃瀹氭垚鍥哄畾鍊)鏈鍚庯紝璁剧疆杩欎釜鍧楃骇鏍囩鐨刴argin涓0 auto锛岃缃叾瀹藉害width鐨勫肩暐澶т簬涓変釜li鏍囩鐨勫搴﹀间箣鍜岋紙鍖呭惈涓変釜li鏍囩鐨刴argin鍊硷級锛涙敞鎰忥細鑳屾櫙鑹茶缃湪li鏍囩涓婏紝鑰屼笉鏄痩i鏍囩鐨...
绛旓細.box{width:900px;height:600px;background:#000;margin:0 auto;} /*瀹氫箟box灞鐨瀹藉害锛岃灏忎簬褰撳墠娴忚鍣ㄧ殑鍒嗚鲸鐜囧昂瀵革紝杈硅窛涓婁笅涓0锛屽乏鍙宠嚜鍔紝杩欐牱澶氬嚭鏉ョ殑body閮ㄥ垎灏变細鏄剧ず瀹冪殑鑳屾櫙鑹蹭簡*/ --> </style> </head> <body> <div class="box"></div> </body> </html> ...
绛旓細HTML涓璁剧疆鏍囬灞呬腑鐨勫叿浣撴搷浣滄柟娉曚负锛1銆佹墦寮html搴旂敤杞欢锛屽湪鏂囨湰缂栬緫妗嗕腑锛岃緭鍏ユ枃鏈爣棰樸2銆佸湪杈撳叆濂界殑鏍囬鍓嶉潰鍔犲叆浠ｇ爜style锛歵ext-align锛歝enter銆3銆佷箣鍚庡嵆鍙垚鍔熷皢缃戦〉鐨勬爣棰樿缃负灞呬腑浣嶇疆銆
绛旓細澶栧眰浣犲彲浠ヨ缃负width:100%;margin:0 auto;杩欎釜鏄彲浠ヤ娇瀹藉害鍙栬嚜灞忓箷鍒嗚鲸鐜鐨瀹藉害,骞朵笖灞呬腑鏄剧ず.鍐呭眰鐨勮瘽濡傛灉浣犳兂瑕佸湪姣斿1366鐨勫睆骞曚笂鏄剧ず,閭ｅ氨涔熸槸鎸夌収杩欎釜鍘熷垯,褰撶劧浣犲彲浠ヨ瀹氫竴涓猰ax-width,涓鑸笉浼氳秴鍑烘渶澶у搴,褰撶劧浣犱篃鍙互璁剧疆涓簃in-width,杩欎釜鏄厑璁哥殑鏈灏忕殑瀹藉害,鎰忔濆氨鏄彲浠ヨ秴鍑,浣嗘槸涓嶈兘...
绛旓細鏂规硶濡備笅锛1銆佸乏鍙灞呬腑锛歮argin:0 auto 2銆佷笂涓嬪眳涓細锛1锛夎缃埗绾iv楂樺害锛堝亣璁句负300px锛夛紙2锛夎缃畉able鐨楂樺害锛堝亣璁句负100px锛夛紙3锛夎缃甿argin-top涓猴細300px/2 - 100px/2
绛旓細涔嬪悗锛屽洜涓哄ぇ鍒嗚鲸鐜囨樉绀哄櫒鐨勬櫘鍙锛岀綉椤电殑瀹藉害瓒婃潵瓒婇毦鎶婃彙浜嗭紝浣嗘槸涓轰簡鐓ч【缁濆ぇ澶氭暟浜猴紝鐜板湪涓鑸兘瀹氬湪1000锛屽洜涓虹幇鍦ㄧ粷澶у鏁扮殑鏄剧ず閮藉埌灏戞敮鎸1024鐨勫垎杈╃巼浜嗭紝涓嶈兘鍐嶅浜嗭紝鍥犱负鐜板湪鍐嶅ぇ鐨勮瘽锛屽彲鑳戒細鏈変簺鏄剧ず鍣ㄧ湅涓嶅埌鏁翠釜缃戦〉鐨瀹借瘯锛岀湅璧锋潵寰堣垂鍔层傚綋鐒惰繖涓篃娌℃湁纭ц瀹氾紝浣犲彲浠ヨ窡鎹嚜宸辩殑鍠滃ソ锛...
绛旓細缃戦〉鍐呭榛樿鏄粠宸﹀埌鍙筹紝濡傛灉瑕佹斁鍦ㄤ腑闂达細1銆佺畝鍗曞揩鎹锋柟娉曞氨鏄姞<center>鍐呭</center>鏍囩銆傜ず渚嬶細<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>center灞呬腑</title></head><body><center>鎴戣灞呬腑</center></body></html>2銆乵argin-left:550...
绛旓細鍙互鏀逛笅CSS.璁剧疆涓涓媗eft:auto;right:auto;鍗冲彲瀹炵幇灞呬腑,濡傛灉鏄鹃夯鐑﹀啀澶栭潰濂椾竴涓鍣ㄥ濂椾竴涓狣IV璁剧疆left:auto;right:auto;.濡傛灉鏄疶able鍊奸渶瑕佸惂algin璁剧疆鎴恈enter鍗冲彲浠ュ眳涓.濡傛灉璞′綘璇鐨閭ｄ釜鏍锋兂鏀圭綉绔欏唴鎵鏈夌綉绔.鍙互鍐嶆病涓椤甸潰鍐呭涓涓狣IV璁惧畾涓涓婥SS,鐒跺悗鐢╠w鏌ユ壘鏇挎崲绔欑偣涓嬫墍鏈缃戦〉 ...
绛旓細灞呬腑鏈夊涓媋lign灞呬腑锛center鏍囩灞呬腑锛屾湁margin灞呬腑锛屼篃鍙互浣跨敤瀹氫綅璁＄畻鍑嗙‘浣嶇疆灞呬腑
