HTML margin-left 設定元素左側的邊距區域。 HTML有許多預先定義的標籤，用於更有效地創建網頁，此外，CSS樣式在網站中更高級和裝飾。透過使用這個術語，使用者會更頻繁地吸引網站，因此對商業角度很有幫助。 Html 邊距屬性是幫助建立HTML 網頁螢幕外部空間的功能之一，此外，它們還有一些不同的類型，如左邊距、右邊距、上邊距和下邊距；這些是決定網頁輪廓空間佈局的一些類型。每種類型都有其可能的長度值。
文法:
Html 邊距會根據我們在文件中使用的位置而具有不同的樣式。如果我們使用 HTML 邊距，則使用 CSS 樣式文件作為邊距。
<html>
<head>
<style>
div
{
Margin:values;
}
</style>
</head>
</html>以上程式碼是我們將要討論的網頁 HTML 邊距樣式的基本語法。在 HTML 中，dom 模式主要用於在程式碼後端工作的 HTML 物件。 Html 邊距取決於網頁文件上所應用的不同邊距的元素。我們可以使用javascript函數來自動設定網頁上的邊距。
邊距使用 HTML 和 CSS 標準樣式單位指定固定長度；網頁上甚至允許負值。在此之前，我們將把 margin-left 屬性設為一些值，我們將指派或在文件中指派預設值。預設值為“auto”，否則我們將把這些值聲明為“inherit”、“length”和“percentage” 每個具有不同子值集的指定值將使用 margin-left 屬性價值觀。
長度將計算CSS單元的長度或固定長度。我們根據 HTML 區塊計算寬度和高度的百分比。該欄位也允許負值。如果假設margin有一個top value屬性，使用者瀏覽器會將該值作為寬度的百分比；它不會指定區塊的高度。
使用者瀏覽器將自動計算margin-left值；這取決於文件或網頁外部區域的可用空間。繼承值主要用於HTML內容的父子關係；它用值指定 margin-left 屬性的寬度。在計算網頁中HTML元素的高度和寬度時，我們主要不包含邊距的計算；我們包含其他 HTML 元素，如內邊距、其他內容區域、邊框等。僅計算文件的 HTML 元素 margin-size 屬性的可用空間。
假設我們在 HTML 中聲明兩組發生衝突的邊距。例如，我們分配一個具有右邊距和僅在右側浮點的區塊，並分配另一個具有與其浮點相同的左邊距的區塊。較大的裕度點保持不變，並且不會轉變為較小的值。在這種情況下，區塊的較小邊距區域會折疊，可能無法在網頁上正確顯示，甚至可能從網頁螢幕上消失。一般來說，邊距是透明的。
我們使用 margin 作為簡寫屬性來指定寬度，而不是在叢集程式碼中使用其他邊距規格。這種方法簡化了開發人員區域中的程式碼閱讀。有時，我們可能會像其他邊距類型一樣設定邊距底部值。例如，我們在 CSS 樣式中將一個類別與另一個類別區分開來。我們可以指定每個屬性可能的長度值，只要我們在 HTML 標籤中使用的元素的長度值相等，並且與文字字體和元素字體的高度相關。
在IE 4 或更高版本中向網頁新增物件時，HTML 文件中的邊距值將變為絕對值，而不是在使用瀏覽器時在相容模式下假定IE 版本3 中物件邊距的預設值. HTML 表格元素
IE 4 版本中的標籤。
以下是 HTML 左邊距範例：
代碼：
<html>
<head>
<style>
{
margin: 2;
}
div {
width: 210px;
height: 130px;
background:green;
border-radius: 13px;
}
.sample {
background-color: green;
margin-left: 3%;
}
.sample1 {
background-color: yelllow;
}
.sample2 {
background-color: solid green;
margin-left: -13%;
}
</style>
</head>
<body>
<div id="sample2">
<marquee> Welcome To My Domain</marquee>
</div>
</body>
</html>輸出：
代碼：
<html>
<head>
<style>
#sample {
width: 120%;
}
table, td, th {
border: 3px solid green;
}
table {
width: 212px;
float: left;
margin: 23px 42px;
}
</style>
</head>
<div id="sample">
<table>
<tr>
<th>Mobile Number</th>
<th>Name</th>
</tr>
<tr>
<td>8220244056</td>
<td>Siva</td>
</tr>
<tr>
<td>9075854876</td>
<td>Raman</td>
</tr>
</table>
<p>
<marquee>Welcome To My Domain</marquee>
</p>
</div>
</html>輸出：
代碼：
<html>
<head>
<style>
#sample {
width: 120%;
}
table, td, th {
border: 3px solid green;
}
table {
width: 212px;
float: left;
margin: 23px 42px;
}
</style>
</head>
<div id="sample">
<table>
<tr>
<th>Mobile Number</th>
<th>Name</th>
</tr>
<tr>
<td>8220244056</td>
<td>Siva</td>
</tr>
<tr>
<td>9075854876</td>
<td>Raman</td>
</tr>
</table>
<button type="button" onclick="samples()">Set margin</button>
</div>
<script>
function samples() {
document.getElementById("sample").style.margin-left = "11px 23px 34px 47px";
}
</script>
</html>輸出：
上面的三個範例將給出margin屬性的三種不同用法；第一個範例使用 CSS 樣式和 HTML 的基本 margin 屬性。第二個範例建立 HTML 表格並設定網頁的 margin-left 屬性值。最後一個範例遵循相同的流程，但 JavaScript 會自動設定邊距值。
在HTML中，我們看到margin屬性類型為margin-left；在此基礎上，我們修改了HTML 表格、圖像和視訊；另外，我們將在HTML 文件中對齊佈局並將其設定為左邊距。某些元素在瀏覽器相容性方面不支援 HTML5。
以上是HTML 左邊距的詳細內容。更多資訊請關注PHP中文網其他相關文章！
