CSS Width Height

CSS Width Height

<style>
 div.myStyle {
  background-color: tomato;
  width: 500px;
  height: 200px;
 }
</style>

<div class="myStyle">Width 500px</div>
Width 500px

Ta dùng width và height với px. Hoặc dùng % cũng được. Ví dụ ta xét width là 50% .

<style>
 div.myStyle2 {
  background-color: lightblue;
  width: 50%;
  height: 200px;
 }
</style>

<div class="myStyle2">Width 50%</div>
Width 50%

Nếu ta dùng width là 600px thì khi ta kéo width của browser nhỏ hơn 600px thì sẽ có 1 scrollbar xuất hiện bên dưới. Để không xuất hiện scrollbar ta dùng max-with là 600px.

<style>
 div.myStyle3 {
  background-color: violet;
  max-width: 600px;
  height: 200px;
 }
</style>

<div class="myStyle3">Max Width 600px</div>
Max Width 600px

Width và Height trong CSS cũng đơn giản phải không nào ? ^_^