如何在HTML中插入有序列表號碼

如果我把這樣的：

<html> 
<body align="middle"> 
HEADLINE 
<ol> 
<li>First Item</li> 
</ol> 
</body> 
</html>

的問題是數（1）在左邊時，我想它的標題下對齊。我如何才能將整個列表項目放到中間？

我需要至少在10美譽添加圖片，所以我會提供一個鏈接到另一個網站，你看到的景象：ALIGNING

來源

2013-10-14 Nikolas

你有一個圖片，確切反映你想要什麼？ –

你是否熟悉css？ ol li {text-align：center;寬度：300像素; }'例如 –

這聽起來像是一個CSS的工作，而不是HTML。 –

您對齊文本在體內。

試試這個：

.center { 
 
    text-align: center; 
 
    list-style-position: inside; 
 
}

<h4 align="center">HEADLINE</h4> 
 
<ol class="center"> 
 
    <li>First Item</li> 
 
</ol>

來源

2013-10-14 16:58:38

這對我有用，爲什麼它不像我試圖做的那樣在一個單獨的CSS文件中工作？ – Nikolas

對讀者來說 - 關鍵是'list-style-position：inside;'。它會導致瀏覽器考慮列表標記（在這種情況下，數字）與文本內聯，因此它可以受到'text-align'的影響。 – Beejamin

尼古拉，在CSS有序列表上對齊的數字如下：

 ol 
    { 
     display: inline-block; 
     margin-left: auto; 
     margin-right: auto; 
    }

**你必須使用一個顯示器 - 因爲你需要把你的列表放在一個盒子裏，以便將數字與列表中心對齊。

來源

2015-09-23 16:21:07 Halie

除了Nuno Duarte的回答，你可以在列表數字後添加中斷（我認爲）使它在中心模式下看起來更好。（免責聲明：跨瀏覽器未測試）

.text-center { 
 
    text-align: center; 
 
} 
 
ol.text-center { 
 
    list-style-position: inside; 
 
    padding-left: inherit; /*Get rid of padding to center correctly*/ 
 
} 
 
    ol.text-center > li::before { 
 
     content: "\A"; 
 
     white-space: pre; 
 
    }

<h4 class="text-center">HEADLINE</h4> 
 
<ol class="text-center"> 
 
    <li>First Item</li> 
 
</ol>

來源

2018-03-05 10:29:08 Godsayah

如何在HTML中插入有序列表號碼

回答

相關問題