CSS @media, media types nedir?

CSS’nin önemli özelliklerinden biri de ekran, baskı, ses sentezleyici, braille cihazı gibi farklı medyalarda dokümanınızın nasıl görüntülenebileceğini belirleyebilmesidir.

Medyaya özel CSS’yi belirlemek için iki yol mümkün;

Birincisi

@import url(“fancyfonts.css”) screen;
@media print {
/* Baskı için css başlangıcı */
}

İkincisi

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”>
<HTML>
<HEAD>
<TITLE>Hedef Medya Linki</TITLE>
<LINK REL=”stylesheet” TYPE=”text/css”
MEDIA=”print, handheld”
HREF=”baski-elcihazi.css”>
</HEAD>
<BODY>
<P>The body…
</BODY>
</HTML>

@media kuralı;

Ayrı bir medya hakkında farklı kuralların işleyeceğini belirlemek için kullanılır.

Baskıya özel kurallar için

@media print {
body { font-size: 10pt)
}

Ekrana özel kurallar için

@media screen {
body { font-size: 13px }
}

Ekrana ve baskıya özel kurallar

@media screen, print {
body { line-height: 1.2 }
}

Yorum bırakın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Scroll to Top