網頁設計如何居中_網頁製作頁面如何居中

1、在HTML網頁設計時中，怎麼樣布局使得<body>中的整體居中？也就是說，當html頁面寬度小於

<html>
  <head>
  </head>
  <body>
    <div id="wrap">測試</div>
  </body>
</html>#wrap{width:980px;margin:0 auto;height:100px;background-color:red;}

margin:0 auto;就會使div位於中間位置。望採納！

2、網頁設計中如何使頁面居中對齊？

在你要居中的標簽中加入 style="margin-left:auto;margin-right:auto;" 當然，有個前提是，你的文件頭必須是標準的dtd。

3、dreamweaver 網頁設計如何讓網頁在瀏覽器里居中

最容易的是,將你所有的html代碼放在這個div裡面:
<div style="width:950px;height:auto;margin:0 auto;">
(把你原來的內容放進來,也就是你<body>與</body>之間的所有代碼,width:950px;必須要有寬度,根據你自己的寬度來改一下就OK了!)
</div>

大概樣子:
<body>
<div style="width:950px;height:auto;margin:0 auto;">
你的網頁內容:
.....
...
</div>
</body>

參考資料： www.ruofeel.cn

4、如何讓製作的網頁在IE瀏覽器中居中顯示？

直接給你的BODY加一個CSS：文本居中。

之後無論你建立一個層還是一個表格，它始終都是在頁面中間顯示。

這是一個最基本的CSS的運用，目前網頁切圖必不可少的工作就是在剛剛打開一個新的頁面的時候給BODY賦一個CSS，除了居中之外，還有網頁中顯示量最大的字體、背景色等等。這是開始將一張效果圖實現成具體網頁的必須工作。

那麼接下來就要根據你的需要給內容嵌套一個層或者一個表格了。我習慣上使用層，然後把網頁里的所有的內容放在這個DIV裡面，當然還是需要用CSS來控制它......事實上這是一種設計模式，更准確的說是我個人習慣的一種切圖方式。

不同的人設計網頁會用不同的方式，那麼我們作為專業設計師會給自己一個比較符合標准和使用習慣，並且可以將誤差降低到最小程度的設計思路，而切圖工作則是其中的一個部分。它的重點在於實現，將效果圖一分不差的實現在頁面上，這個過程不需要太多的創意，不需要個性或者理念，它只需要一個習慣，或者說是一個合理的控制流程。也應該是網頁設計當中一個最不可少也最為枯燥的過程了。

建議你找一個比較專業的設計師來帶帶你，這樣可以在最短的時間內幫你養成一個好的切圖習慣，它可以減少你工作當中大量的時間。

另外，多花點時間學習CSS但不要局限於它。

5、在網頁製作中如何控制DIV居中顯示，用CSS怎麼控制背景圖片大小？

1、首先，打開html編輯器，新建html文件，例如：index.html。

2、在index.html中的<style>標簽中，輸入css代碼：

body {text-align: center;background: url(small2.png); background-size: 60%;}

3、瀏覽器運行index.html頁面，此時成功通過css控制了div居中顯示，背景圖片的大小為60%。

6、網頁製作中如何設置標題中的文字是垂直居中

實現的方法和詳細的操作步驟如下：

1、第一步，創建一個新的html文檔，在body標簽中添加一個div標簽並填寫一段文本，然後為該div設置一些樣式，見下圖，轉到下面的步驟。

2、第二步，執行完上面的操作之後，將「
text-align」屬性添加到div，該屬性值為「 center」，然後文本將在框架內水平居中，見下圖，轉到下面的步驟。

3、第三步，執行完上面的操作之後，將「
line-height」屬性添加到div，該屬性值為div的高度，然後文本將在框中垂直居中，見下圖。這樣，就解決了這個問題了。

7、在網頁設計中，如何讓網頁居中顯示，經常會網頁會靠左對齊

在網頁設計中，可以嘗試將所有網頁放在一個大的div中，再將該div的,左右margin設為auto:
完整的例子為：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>居中</title>
<style>
body{ text-align:center}
.main{ margin:0 auto; width:500px; height:200px; border:1px solid #F00}
</style>
</head>
<body>
<div class="main">我所在DIV在任意瀏覽器均布局居中</div>
</body>
</html>

8、網頁製作頁面如何居中

9、網頁製作如何居中，讓布局自動適應不同顯示屏

首先先，這個頁面在mozilla、opera和IE瀏覽器中均可以實現居中和高度自適應。我們來分析代碼：
完整代碼<html>
<head>
<style
type="text/css">
body{
background:#999;
text-align:center;
color:
#333;
font-family:arial,verdana,sans-serif;
}
#header{
width:776px;
margin-right:
auto;
margin-left:
auto;
padding:
0px;
background:
#EEE;
height:60px;
text-align:left;
}
#contain{
margin-right:
auto;
margin-left:
auto;
width:
776px;
}
#mainbg{
width:776px;
padding:
0px;
background:
#60A179;
float:
left;
}
#right{
float:
right;
margin:
2px
0px
2px
0px;
padding:0px;
width:
574px;
background:
#ccd2de;
text-align:left;
}
#left{
float:
left;
margin:
2px
2px
0px
0px;
padding:
0px;
background:
#F2F3F7;
width:
200px;
text-align:left;
}
#footer{
clear:both;
width:776px;
margin-right:
auto;
margin-left:
auto;
padding:
0px;
background:
#EEE;
height:60px;}
.text{margin:0px;padding:20px;}
</style>
</head>
<body>
<div
id="header">header</div>
<div
id="contain">
<div
id="mainbg">
<div
id="right">
<div
class="text">right<p>1</p><p>1</p><p>1</p><p>1</p><p>1</p></div>
</div>
<div
id="left">
<div
class="text">left</div>
</div>
</div>
</div>
<div
id="footer">footer</div>
</body>
</html>
代碼分析
首先我們定義body和頂部第一行#header，這裡面的關鍵是body中的text-align:center;和header中的margin-right:
auto;margin-left:
auto;，通過這兩句使得header居中。註：其實定義text-align:center;就已經在IE中實現居中，但在mozilla中無效，需要設置margin:auto;才可以實現mozilla中的居中。
接下來定義中間的兩列#right和#left。為了使中間兩列也居中，我們在它們外面嵌套一個層#contain，並對contain設置margin:auto;，這樣#right和#left就自然居中了。
注意中間兩列定義的順序，我們首先定義#right，通過float:
right;

導航:首頁 > 萬維百科 > 網頁設計如何居中

網頁設計如何居中

與網頁設計如何居中相關的知識