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

網頁設計字居中

 發布時間：2021-03-06 17:33:05

1、網頁文字居中的代碼是什麼？

<!DOCTYPE HTML>

<html lang="en">

<head>

<title>html文字居中測試</title>

<meta charset="UTF-8">

<style type="text/css">

body{background: #ddd;}

div{width:300px;height:180px;margin:10px auto;color:#fff;font-size:24px;}

.box1{background: #71a879;text-align: center;}

.box2{background: #6a8bbc;line-height: 200px;}

.box3{background: #dea46b;text-align: center;line-height: 200px;}

</style>

</head>

<body>

<divclass="box1">html文字水平居中</div>

<divclass="box2">html文字垂直居中</div>

<divclass="box3">html文字水平上下居中</div>

</body>

</html>

(1)網頁設計字居中擴展資料：

html自定義字體樣式

一般字體的設置包含：字體，字體大小，字體顏色

html設置字體的話有很多標簽去設置

h1,h2,h3,h4,h5,h6 標題

採用css屬性。用font去設置字體。

font-family 規定元素的字體系列。包含：宋體，微軟雅黑等這些字體之類的。font-family:Microsoft yahei 表示設置字體為微軟雅黑

font-weight是設置字體的粗細。包含：lighter（更細），normal（正常），bold（粗體），bolder（更粗）font-weight:bold設置字體為粗體

font-size 是字體的尺寸，可以用使用百分比去設置或者像素去設置。如:font-size:18px

color屬性是設置字體的顏色。可以採用

color:red; (顏色名稱)color:#00ff00; （顏色的十六進制）color:rgb(0,0,255);（顏色的rgb）
例子：
<style type="text/css">

.title{font-family:Microsoft yahei;font-size:16px;font-weight:bold;color:#ccc}
</style>
我是標題

2、網頁設計中怎樣設置所有內容居中

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-cn">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>居中div演示效果</title>
<style type="text/css">
.align-center{
margin:0 auto; /* 居中 這個是必須的，，其它的屬性非必須 */
width:500px; /* 給個寬度 頂到瀏覽器的兩邊就看不出居中效果了 */
background:red; /* 背景色 */
text-align:center; /* 文字等內容居中 */
}
</style>
</head>

<body>
<div class="align-center">居中div演示效果<br/><br/>更多代碼請訪問 <a href="http://www.poluoluo.com/" target="_blank">破洛洛</a></div>
</body>
</html>

3、html模塊里怎麼讓文字居中，字體大小及顏色！

文字居中：text-align:center;

字體大小：font-size:24px;

字體顏色：color:#000;

text-align：屬性規定元素中的文本的水平對齊方式。

該屬性通過指定行框與哪個點對齊，從而設置塊級元素內文本的水平對齊方式。通過允許用戶代理調整行內容中字母和字之間的間隔，可以支持值 justify；不同用戶代理可能會得到不同的結果。

font-size：屬性可設置字體的尺寸。

該屬性設置元素的字體大小。注意，實際上它設置的是字體中字元框的高度；實際的字元字形可能比這些框高或矮（通常會矮）。

各關鍵字對應的字體必須比一個最小關鍵字相應字體要高，並且要小於下一個最大關鍵字對應的字體。

color：屬性規定文本的顏色。

這個屬性設置了一個元素的前景色（在 HTML 表現中，就是元素文本的顏色）；光柵圖像不受 color 影響。這個顏色還會應用到元素的所有邊框，除非被 border-color 或另外某個邊框顏色屬性覆蓋。

要設置一個元素的前景色，最容易的方法是使用 color 屬性。

(3)網頁設計字居中擴展資料：

示例代碼：

.aa{

width: 200px;

height: 200px;

text-align: center;

background: #000;

color: #fff;

font-size: 24px;

}

HTML部分：

<div class="aa">想居中的文字</div>

4、html如何讓文字居中顯示？

html如何讓文字居中顯示

通過設置「左右margin」值為「auto」來實現居中的。我們來看個例子就是設置 div 這個塊狀元素水平居中：

html代碼：

<style>div{  border:1px solid red;/*為了顯示居中效果明顯為 div 設置了邊框*/

width:200px;
margin:20px auto;/* margin-left 與 margin-right 設置為 auto */}</style><body>
</div></body>也可以寫成：

margin-left:auto;
margin-right:auto;

5、HTML中字元居中代碼是什麼

如果單純用html語言的話，就是<center></center> 這一對，如果是搞網頁設計的話，建議使用css語言來修飾網頁。操作方法如下：

1、首先雙擊打開HBuilderX開發工具，創建一個Web項目，並在項目pages文件夾下，新建靜態頁面center.html。

2、打開center.html文件，修改title標簽中的文本顯示內容。

3、在<body></body>標簽中，插入一個div標簽，並添加標簽的id屬性。

4、利用ID選擇器在style標簽中，設置div標簽的樣式屬性，如寬度、高度、行高、字體屬性等。

5、接著給div標簽添加一個樣式屬性background-color。

6、再次保存代碼並刷新瀏覽器，可以看到字體在背景顏色塊中間位置，說明字體居中顯示。

6、網頁設計里讓一個div標簽里的文字豎直居中用哪個標簽？

如果是單行文字想垂直居中，只要保證div高和行高保持一致，就可以了。用下面的代碼即可實現：

CSS代碼：

#div-a{
height:60px;
line-height:60px;
}

HTML代碼：

<div id="div-a">
......
</div>

如果是多行文字，上面的垂直居中的方法就不行了，得用變通的方法實現；這里建議使用table方法，在table外面再套上相應的div，

代碼如下：

<table>
<tr><td style="vertical-align:middle;height:300px;background-color:red">
</td></tr>
</table>

多行文字居中還有另外一種方法：

多行內容居中，且容器高度可變，也很簡單，給出一致的 padding-bottom 和 padding-top 就行：

.middle-demo-2
{
padding-top: 24px;
padding-bottom: 24px;
}

7、html如何讓文字居中顯示

你的話有歧義，所以導致下面的回答有歧義。

兩種情況：1、文本格式居中；2、文本所在標簽居中顯示在窗口中。

1、如其他匿名用戶回答的一樣，給文本所在標簽加CSS屬性值"text-align:center"即可。例如：

<p style="text-align:center">我是文本，居中顯示</p>

2、有很多種方法，這里介紹兩種，例如：

1）（建議）文本應該被 行內標簽或行內塊級標簽 包裹，行內標簽或行內塊級標簽又被 塊級標簽包裹。此種方式 文本格式 會居中。若想 文本格式 不居中，可在行內標簽或行內塊級標簽中加CSS屬性值"text-align:left"或其他。

<div style="text-align:center"> <!-- 塊級標簽 -->
    <span>我是文本所在標簽1，文本居中顯示<span> <!-- 行內標簽 -->
    <div style="display:inline-block;">我是文本所在標簽2，文本居中顯示</div> <!-- 行內塊級標簽 -->
</div>

2）文本被塊級標簽包裹。為塊級標簽設置寬度，並加上CSS屬性值" margin:0 auto"。此種方式 文本格式 不會居中。若想 文本格式 也居中，可在塊級標簽加CSS屬性值"text-align:center"。

<div style="width: 100px; margin:0 auto">我是文本所在標簽，文本居中顯示</div>

以上，謝謝。

8、網頁設計中內容全部居中怎麼弄啊

全部換成表格吧，想怎麼居中都行的，圖層居中對於初學者有一定的難度，建的css樣式裡面需要設置相對位置什麼的，你說的id建好後，還需要進入代碼操作才可以居中，總之比較麻煩，

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

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

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

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

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

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