CSS Dersleri 10 - Yükseklik (Height) ve Genişlik (Width)

Merhaba değerli Kodlama Vakti takipçileri, bu dersimizde CSS Yükseklik ve Genişlik konularını öğreneceğiz.

CSS "height" ve "width" özellikleri , bir etiketin yüksekliğini ve genişliğini ayarlamak için kullanılır.Yükseklik ve genişlik özellikleri, dolgu, kenarlıklar veya kenar boşlukları içermez. Etiketin dolgusu, kenarlığı ve kenar boşluğu içindeki alanın yüksekliğini / genişliğini ayarlar.Yükseklik ve genişlik özellikleri aşağıdaki değerlere sahip olabilir:

• auto : Varsayılan değerdir. Tarayıcı, yüksekliği ve genişliği hesaplar
• length : px, pt, cm gibi ölçüler
• % : yüzdelik dilim olarak ifade edilebilir
• initial : Yüksekliği / genişliği varsayılan değerine ayarlar
• inherit : Üst etiketten miras alır.

CSS Height ve Width Kullanımı :

div {
  height: 200px;
  width: 50%;
  background-color: blue;
}

max-width ve min-width

CSS max-width Kullanımı :

p.ex1 {
  max-width: 150px;
}

CSS min-width Kullanımı :

span {
  background-color: yellow;  
}

span.ex1 {
  min-width: 500px;
  display: inline-block;
}

max-height ve min-height

CSS max-height Kullanımı :

span {
  background-color: yellow;  
}

span.ex1 {
  min-width: 500px;
  display: inline-block;
}

CSS min-height Kullanımı :

p.ex1 {
  max-height: 50px;
  overflow: auto;
}