CSS padding-left用法及代碼示例

填充是其內容與其邊界之間的空間。 CSS中的padding-left屬性用於設置元素左側的填充區域的寬度。

用法:

padding-left:length|percentage|initial|inherit;

屬性值：

length:此模式用於將填充大小指定為固定值。默認值為0。它必須為非負數。

用法:

padding-left:length;

例：

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            padding-left Property 
        </title> 
        <style> 
            .geek { 
                padding-left:90px; 
                color:white; 
                background:green; 
            } 
        </style> 
    </head> 
      
    <body> 
        <h1 style = "color:green; text-align:center"> 
            GeeksforGeeks 
        </h1> 
          
        <h2 style = "text-align:center"> 
            padding-left Property 
        </h2> 
          
        <!-- padding-left property used here -->
        <p class="geek"> 
            This paragraph has a padding-left:90px; 
        </p> 
    </body> 
</html>

輸出：
paddingleft

percentage:此模式用於以元素寬度的百分比指定左填充。它必須是非負的。

用法:

padding-left:percentage;

例：

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            padding-left Property 
        </title> 
        <style> 
            .geek { 
                padding-left:25%; 
                color:white; 
                background:green; 
            } 
        </style> 
    </head> 
      
    <body> 
        <h1 style = "color:green; text-align:center"> 
            GeeksforGeeks 
        </h1> 
          
        <h2 style = "text-align:center"> 
            padding-left Property 
        </h2> 
          
        <!-- padding-left property used here -->
        <p class = "geek"> 
            This paragraph has a padding-left:25%; 
        </p> 
    </body> 
</html>

輸出：
paddingleft

initial:此屬性用於將padding-left設置為其默認值。
用法：
```
padding-left:initial;
```

支持的瀏覽器：下麵列出了padding-left屬性支持的瀏覽器：

穀歌瀏覽器1.0
Internet Explorer 4.0
Firefox 1.0
Opera 3.5
蘋果Safari 1.0

相關用法

注：本文由純淨天空篩選整理自Vishal Chaudhary 2大神的英文原創作品 CSS | padding-left Property。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。