div 寬度50是指在HTML和CSS中，使用div元素并設置其寬度為50%。div元素是HTML中常用的塊級元素之一，可以用于創建網頁的布局和分割區域。通過設置div的寬度為50%，可以使其占據父元素寬度的一半，實現簡單的頁面布局效果。
下面將通過幾個代碼案例詳細解釋和說明div寬度為50%的使用方法。
案例一：

html
<p>下面的例子中，我們使用了一個id為wrapper的div元素，并設置了其寬度為50%。這意味著該div元素的寬度將占據父元素寬度的一半。</p>
<br>
<pre>
<div id="wrapper" style="width: 50%;">
這是一個div寬度為50%的示例
</div>

在上面的例子中，我們通過style屬性直接設置div的寬度為50%。也可以將樣式寫在外部樣式表中，并通過class或id選擇器來應用樣式。

案例二：html

下面的例子中，我們使用了一個class為box的div元素，并設置了其寬度為50%。我們還將該div元素的背景色設置為紅色，以便更好地展示效果。

<div class="box">
這是一個div寬度為50%的示例
</div>
<br>
<style>
.box {
width: 50%;
background-color: red;
}
</style>

在上面的例子中，我們通過class選擇器將樣式應用到了div元素上。我們也可以使用id選擇器來選擇并設置div元素的樣式。

案例三：`html

下面的例子中，我們使用了一個id為container的div元素作為容器，并包含了兩個寬度為50%的div元素。這樣，兩個div元素將平分父元素的寬度。

<div id="container">
<div class="box">
這是一個div寬度為50%的示例
</div>
<br>
    <div class="box">
這是另一個div寬度為50%的示例
</div>
</div>
<br>
<style>
#container {
display: flex;
}
<br>
    .box {
width: 50%;
background-color: red;
}
</style>

在上面的例子中，我們使用了flex布局來設置容器元素的樣式，使兩個div元素平分父元素的寬度。

通過以上幾個案例的講解，我們可以看到如何使用div寬度50%來實現簡單的頁面布局效果。這在響應式設計和移動端開發中尤為常見。使用div寬度50%可以靈活地劃分頁面空間，使頁面在不同屏幕尺寸下呈現更好的顯示效果。