Responsive Nedir?
Dil karşılığı olarak duyarlı, hassas anlamlarına gelmektedir. Peki bunun web dünyasında karşılığı nedir dersek?Bu soruya karşılık olarak bilgisayarda ziyaret ettiğiniz bir web sitesinin tablet, cep telefonu vs.. cihazlarda ekranının genişlik değerine uygun olarak davranmasıdır.
Responsive Ne İşe Yarar?
Örnek verecek olursak, bilgisayarda ziyaret ettiğiniz bir web sayfasının menü genişliği (980px) olarak varsayalım. Yeterince geniş olan bu menü, mobilden ziyaret edilince (telefon veya tablet) küçük ve açılır bir halde olduğu görebiliriz.Peki bu ekran genişlikleri gibi değerleri css ile nasıl algılarız? İşte bu sorunun cevabını da birkaç örnek ile açıklamaya çalışalım.
Normal geniş ekranlarda genişliği 1000px olan kapsul değerimizi, tablet gibi biraz da küçük ekranlara göre daha da küçük olarak belirtelim.
Normal Ekranlara Göre
.kapsul{width:1000px;}
Tablet Ekranlarına Göre
@media (max-width:767px)
{
.kapsul{width:600px;}
}
