CSS Margins, web tasarımında elementler arası boşlukları kontrol etmek için hayati öneme sahiptir. Bu kapsamlı rehberle CSS margin özelliklerini, kullanımını ve ileri düzey tekniklerini keşfedin.
CSS Margins Nedir ve Web Tasarımındaki Önemi
Web tasarımında elementler arası boşlukları yönetmek, estetik ve işlevsel bir düzen oluşturmanın temelidir. İşte bu noktada CSS Margins devreye girer. CSS Margins, bir HTML elementinin dış kenarlığı ile diğer elementler arasındaki boşluğu tanımlayan bir CSS özelliğidir. Bu boşluklar, elementlerin birbirine çok yapışmasını önleyerek içeriğin daha okunabilir ve görsel olarak daha çekici olmasını sağlar.
Web sayfalarındaki düzenin belirlenmesinde kritik bir rol oynayan CSS Margins, elementlerin konumlandırılması ve sayfa akışının kontrol edilmesinde vazgeçilmezdir. Doğru kullanıldığında, karmaşık düzenlerin bile kolayca oluşturulmasına olanak tanır. Bir elementin çevresindeki boşluğu ayarlayarak, tasarımcılar ve geliştiriciler, kullanıcı deneyimini önemli ölçüde iyileştirebilirler.
CSS Margin Özellikleri: Temel Kullanım Yöntemleri
CSS Margins, bir elementin dört tarafına (üst, sağ, alt, sol) ayrı ayrı veya tek bir kısaltma özelliği ile uygulanabilir. Bu esneklik, geliştiricilere farklı senaryolar için çeşitli kontrol mekanizmaları sunar. Her bir taraf için ayrı ayrı değer atayabileceğiniz gibi, tek bir satırda tüm kenarların boşluğunu da belirleyebilirsiniz.
Tek Yönlü Margin Tanımlama
Bir elementin belirli bir tarafına boşluk eklemek istediğinizde, tek yönlü margin özellikleri kullanılır. Bu özellikler şunlardır:
margin-top: Elementin üst kenarı ile yukarıdaki element arasındaki boşluğu ayarlar.margin-right: Elementin sağ kenarı ile sağındaki element arasındaki boşluğu ayarlar.margin-bottom: Elementin alt kenarı ile aşağıdaki element arasındaki boşluğu ayarlar.margin-left: Elementin sol kenarı ile solundaki element arasındaki boşluğu ayarlar.
Örneğin, bir paragrafın alt kısmına 20 piksel boşluk eklemek için şu kodu kullanabilirsiniz:
p {
margin-bottom: 20px;
}Bu yöntem, özellikle belirli bir yönde hassas boşluk ayarlamaları yapmanız gerektiğinde oldukça kullanışlıdır. Her bir tarafın bağımsız olarak kontrol edilmesi, tasarımda daha fazla esneklik sağlar.
Kısaltılmış Margin Tanımlama (Shorthand)
Dört margin özelliğini tek bir margin özelliği ile tanımlamak mümkündür. Bu, kodunuzu daha kısa ve okunabilir hale getirir. Kısaltılmış kullanımın birkaç farklı biçimi vardır:
- Tek değer:
margin: 10px;-> Tüm kenarlara (üst, sağ, alt, sol) 10 piksel boşluk uygular. - İki değer:
margin: 10px 20px;-> Üst ve alt kenarlara 10 piksel, sağ ve sol kenarlara 20 piksel boşluk uygular. - Üç değer:
margin: 10px 20px 30px;-> Üst kenara 10 piksel, sağ ve sol kenarlara 20 piksel, alt kenara 30 piksel boşluk uygular. - Dört değer:
margin: 10px 20px 30px 40px;-> Sırasıyla üst, sağ, alt ve sol kenarlara 10, 20, 30 ve 40 piksel boşluk uygular. (Saat yönünde: top, right, bottom, left)
Kısaltılmış kullanım, özellikle tüm veya çoğu kenarın benzer boşluk değerlerine sahip olduğu durumlarda kod tekrarını azaltır ve stil sayfalarını daha düzenli hale getirir. CSS Margins ile çalışma verimliliğini artıran önemli bir özelliktir.
Margin Değerleri ve Birimleri
CSS Margins değerleri için çeşitli birimler kullanılabilir. Her birim, farklı senaryolar ve duyarlı tasarım ihtiyaçları için avantajlar sunar:
- Piksel (px): En yaygın kullanılan birimdir. Kesin ve sabit boşluklar için idealdir. Ekran boyutundan bağımsız, değişmez bir değer sağlar.
- Yüzde (%): Elementin içeren bloğunun genişliğine göre yüzde olarak ayarlanır. Duyarlı tasarımlarda esneklik sağlar, ancak dikey marjinler genellikle içeren bloğun genişliğine göre hesaplanır.
- Em (em): Elementin kendi yazı tipi boyutuna göre ölçeklenir. Erişilebilirlik ve ölçeklenebilirlik için faydalıdır.
- Rem (rem): Kök HTML elementinin (
<html>) yazı tipi boyutuna göre ölçeklenir. Em’e benzer ancak daha tutarlı bir ölçeklendirme sağlar. - Viewport birimleri (vw, vh): Ekranın genişliğine (vw) veya yüksekliğine (vh) göre yüzde olarak ayarlanır. Tamamen duyarlı boşluklar için etkilidir.
- Auto: Yatayda bir elementi ortalamak için kullanılır (
margin: auto;). Elementin belirli bir genişliği olması gerekir. - Negatif değerler: Elementleri birbirine yaklaştırmak veya üst üste bindirmek için kullanılabilir. Dikkatli kullanılmalıdır, aksi takdirde sayfa düzenini bozabilir. Negatif CSS Margins, yaratıcı düzenler oluşturmak için güçlü bir araçtır.
Bir elementin genişliği belirli ise, margin-left: auto; ve margin-right: auto; kullanılarak yatayda otomatik olarak ortalanabilir. Bu, web sayfalarında blok seviyesindeki elementleri hizalamak için sıklıkla tercih edilen bir yöntemdir.
Margin Çakışması (Margin Collapse) Nedir?
CSS Margins ile çalışırken karşılaşılan önemli bir kavram “margin çakışması” veya “margin birleşmesi”dir. Bu durum, dikey olarak bitişik iki veya daha fazla blok seviyesindeki elementin marjinlerinin birleşerek tek bir marjin oluşturmasıdır. Yatay marjinler ise çakışmaz.
Margin çakışması genellikle aşağıdaki durumlarda meydana gelir:
- Bitişik kardeş elementler: Bir elementin
margin-bottomdeğeri ile hemen altındaki elementinmargin-topdeğeri birleşir. Ortaya çıkan marjin, iki değerin en büyüğü olur. - Üst element ile ilk çocuk element: Bir üst elementin
margin-topdeğeri ile ilk çocuk elementininmargin-topdeğeri arasında bir bordür, padding, inline içerik veyaoverflowdeğeri yoksa, bu marjinler birleşir. - Boş elementler: Sadece marjinleri olan boş bir elementin
margin-topvemargin-bottomdeğerleri birleşir.
Margin çakışmasını anlamak ve yönetmek, beklenmedik boşluk sorunlarını çözmek için hayati öneme sahiptir. Modern düzen teknikleri (Flexbox, Grid) genellikle margin çakışmasını önlerken, geleneksel blok düzenlerinde bu durum sıkça görülür. CSS Margins‘in bu davranışı, bazen kafa karıştırıcı olabilir.
Yatay ve Dikey Margin Çakışması
Yukarıda belirtildiği gibi, margin çakışması sadece dikey marjinler için geçerlidir. Bir elementin margin-left veya margin-right değerleri, komşu elementlerin yatay marjinleriyle asla birleşmez. Bu, tasarımcılara yatay boşluklar üzerinde daha öngörülebilir bir kontrol sağlar. Dikey margin çakışması ise, farklı senaryolarda farklı şekillerde kendini gösterebilir ve genellikle beklenenden daha az boşluk bırakır. Bu davranışı engellemek için display: flex, display: grid, overflow: hidden gibi CSS özellikleri kullanılabilir. Ayrıca, üst elemente border veya padding eklemek de çakışmayı önleyebilir. Bu durum, CSS Margins‘in inceliklerinden biridir.
CSS Margins ile Ortalaştırma (margin: auto)
Bir blok seviyesindeki elementi yatayda sayfanın ortasına hizalamak için margin: auto; özelliği oldukça yaygın olarak kullanılır. Bu teknik, elementin sol ve sağ marjinlerini otomatik olarak eşit boşluklara bölerek elementi ortalar.
Bu yöntemle ortalama yapabilmek için iki temel koşul vardır:
- Element bir blok seviyesi elementi olmalıdır (
<div>,<p>,<h1>vb. varsayılan olarak bloktur). - Elementin belirli bir genişliği (
width) tanımlanmış olmalıdır. Eğer genişlik belirtilmezse, element varsayılan olarak mevcut alanı kaplayacağı için ortalama işlemi gerçekleşmez.
.container {
width: 80%; /* veya sabit piksel değeri */
margin: 0 auto;
}margin: 0 auto; kodu, elementin üst ve alt marjinlerini sıfır yaparken, sol ve sağ marjinlerini otomatik olarak ayarlayarak yatayda ortalar. Bu, web sayfalarında ana içerik alanlarını veya belirli bileşenleri ortalamak için çok etkili bir yoldur. Modern CSS düzenlerinde Flexbox veya Grid gibi teknikler de ortalama için kullanılsa da, margin: auto basit ve etkili bir çözüm olmaya devam etmektedir.
Duyarlı Tasarımda CSS Margins Kullanımı
Duyarlı web tasarımı, web sitelerinin farklı ekran boyutlarına ve cihazlara uyum sağlamasını gerektirir. CSS Margins, bu uyumu sağlamak için güçlü bir araçtır. Marjin değerlerini duyarlı bir şekilde ayarlayarak, içeriğin küçük ekranlarda sıkışmasını veya büyük ekranlarda aşırı yayılmasını engelleyebilirsiniz.
Duyarlı marjinler için aşağıdaki yaklaşımlar önemlidir:
- Yüzde (%) birimleri: Marjinleri yüzde olarak tanımlamak, elementin ebeveynine göre ölçeklenmesini sağlar. Bu, ekran boyutu değiştikçe boşlukların da orantılı olarak ayarlanmasına yardımcı olur.
- Viewport birimleri (vw, vh): Ekranın genişliğine veya yüksekliğine göre boşluklar tanımlamak, daha dinamik ve esnek bir duyarlılık sunar. Örneğin,
margin-top: 2vw;ekran genişliğine göre üst boşluğu ayarlar. - Media sorguları (Media Queries): Belirli ekran boyutları için farklı margin değerleri tanımlamak, en hassas kontrolü sağlar. Örneğin, mobil cihazlar için daha küçük marjinler, masaüstü için daha büyük marjinler belirleyebilirsiniz.
.card {
margin: 15px; /* Varsayılan marjin */
}
@media (max-width: 768px) {
.card {
margin: 10px; /* Mobil cihazlar için daha küçük marjin */
}
}TPKmedya Ajansı gibi profesyonel web tasarım firmaları, duyarlı tasarımlarda CSS Margins‘in bu esnekliğini etkin bir şekilde kullanarak, her cihazda mükemmel görünen ve kullanıcı dostu web siteleri inşa etmektedir. Duyarlı CSS Margins kullanımı, modern web geliştirmenin ayrılmaz bir parçasıdır. Daha fazla bilgi ve profesyonel destek için TPKmedya Ajansı web sitesini ziyaret edebilirsiniz.
CSS Margins, web tasarımında boşluk yönetimi ve düzen oluşturmanın temel taşlarından biridir. Elementler arası görsel ayrımı sağlamaktan, içeriği ortalamaya ve duyarlı tasarımlar oluşturmaya kadar geniş bir kullanım alanına sahiptir. Margin çakışması gibi inceliklerini anlamak ve farklı birimlerle esnek bir şekilde kullanmak, her geliştiricinin ve tasarımcının bilmesi gereken önemli becerilerdendir. Doğru uygulandığında, CSS Margins, kullanıcı deneyimini zenginleştiren, temiz ve profesyonel görünümlü web sayfaları oluşturmanın anahtarıdır.
{
“@context”: “https://schema.org”,
“@type”: “FAQPage”,
“mainEntity”: [
{
“@type”: “Question”,
“name”: “CSS margin nedir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “CSS margin, bir HTML elementinin dış kenarlığı ile diğer elementler arasındaki boşluğu tanımlayan bir CSS özelliğidir.”
}
},
{
“@type”: “Question”,
“name”: “CSS margin ve padding arasındaki fark nedir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Margin, elementin dışındaki boşluğu kontrol ederken; padding, elementin içeriği ile kendi kenarlığı arasındaki iç boşluğu kontrol eder.”
}
},
{
“@type”: “Question”,
“name”: “Margin-top, margin-right, margin-bottom, margin-left ne işe yarar?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Bu özellikler, bir elementin sırasıyla üst, sağ, alt ve sol kenarlarındaki dış boşluğu ayrı ayrı ayarlamak için kullanılır.”
}
},
{
“@type”: “Question”,
“name”: “CSS margin shorthand (kısaltma) nasıl kullanılır?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Tek bir ‘margin’ özelliği ile tüm kenarları veya belirli kenar çiftlerini ayarlayabilirsiniz. Örneğin, ‘margin: 10px;’ tüm kenarlara 10px, ‘margin: 10px 20px;’ üst/alt 10px, sağ/sol 20px boşluk verir.”
}
},
{
“@type”: “Question”,
“name”: “Margin: auto ne anlama gelir ve ne için kullanılır?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “‘margin: auto;’ bir blok seviyesindeki elementi yatayda ortalamak için kullanılır. Elementin belirli bir genişliğe sahip olması gerekir.”
}
},
{
“@type”: “Question”,
“name”: “Negatif margin değerleri kullanabilir miyim?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Evet, negatif margin değerleri elementleri birbirine yaklaştırmak veya üst üste bindirmek için kullanılabilir, ancak dikkatli kullanılmalıdır.”
}
},
{
“@type”: “Question”,
“name”: “Margin çakışması (margin collapse) nedir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Dikey olarak bitişik iki veya daha fazla blok seviyesindeki elementin marjinlerinin birleşerek tek bir marjin oluşturması durumudur. Sadece dikey marjinlerde görülür.”
}
},
{
“@type”: “Question”,
“name”: “Margin çakışması nasıl önlenir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Margin çakışmasını önlemek için ‘display: flex’, ‘display: grid’, ‘overflow: hidden’ gibi CSS özellikleri veya border/padding ekleme yöntemleri kullanılabilir.”
}
},
{
“@type”: “Question”,
“name”: “Yüzde (%) birimleri margin için nasıl çalışır?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Yüzde birimleri, elementin içeren bloğunun genişliğine göre hesaplanır. Dikey marjinlerde de genellikle içeren bloğun genişliği referans alınır.”
}
},
{
“@type”: “Question”,
“name”: “Em ve rem birimleri margin için neden önemlidir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Em ve rem birimleri, yazı tipi boyutuna göre ölçeklendiği için duyarlı tasarımlarda ve erişilebilirlik açısından daha esnek ve dinamik boşluklar sağlar.”
}
},
{
“@type”: “Question”,
“name”: “Inline elementlere margin uygulanabilir mi?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Inline elementlere yatay margin (left/right) uygulanabilirken, dikey margin (top/bottom) elementin çevresindeki diğer inline içerikleri etkilemez.”
}
},
{
“@type”: “Question”,
“name”: “Margin değeri olarak ‘0’ kullanmak ne anlama gelir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Margin değeri olarak ‘0’ kullanmak, o kenarda hiçbir dış boşluk olmayacağı anlamına gelir. Genellikle varsayılan tarayıcı marjinlerini sıfırlamak için kullanılır.”
}
},
{
“@type”: “Question”,
“name”: “CSS margin değerlerinde hangi birimler kullanılabilir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Piksel (px), yüzde (%), em, rem, viewport birimleri (vw, vh) ve ‘auto’ gibi değerler kullanılabilir.”
}
},
{
“@type”: “Question”,
“name”: “Duyarlı tasarımda marginleri nasıl kullanmalıyım?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Yüzde, em, rem veya viewport birimleri kullanarak ve media sorguları ile farklı ekran boyutları için farklı margin değerleri belirleyerek duyarlı marginler oluşturabilirsiniz.”
}
},
{
“@type”: “Question”,
“name”: “Margin: 0 auto; ile bir element nasıl ortalanır?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Bu kod, elementin üst ve alt marjinlerini sıfırlarken, sol ve sağ marjinlerini otomatik olarak ayarlayarak blok seviyesindeki elementi yatayda ortalar. Elementin genişliği belirlenmiş olmalıdır.”
}
},
{
“@type”: “Question”,
“name”: “Margin çakışması parent-child ilişkisinde nasıl olur?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Bir üst elementin ‘margin-top’ değeri ile ilk çocuk elementinin ‘margin-top’ değeri arasında border, padding veya inline içerik yoksa bu marjinler birleşir.”
}
},
{
“@type”: “Question”,
“name”: “Margin değerleri miras alınır mı?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Hayır, CSS margin değerleri varsayılan olarak miras alınmaz. Her elementin kendi marjinleri ayrı ayrı tanımlanır.”
}
},
{
“@type”: “Question”,
“name”: “Margin ile elementler arasında boşluk oluşturmanın faydaları nelerdir?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Görsel ayrım, okunabilirlik artışı, estetik bir düzen, elementlerin doğru konumlandırılması ve kullanıcı deneyiminin iyileştirilmesi gibi faydaları vardır.”
}
},
{
“@type”: “Question”,
“name”: “Margin değerleri tarayıcılar arasında farklılık gösterir mi?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Temel margin özellikleri genellikle tutarlıdır, ancak varsayılan tarayıcı stilleri (user agent stylesheets) bazı elementlere farklı varsayılan marjinler uygulayabilir. Bu nedenle ‘reset’ veya ‘normalize’ CSS kullanmak faydalı olabilir.”
}
},
{
“@type”: “Question”,
“name”: “Flexbox veya Grid kullanırken margin çakışması olur mu?”,
“acceptedAnswer”: {
“@type”: “Answer”,
“text”: “Hayır, Flexbox veya CSS Grid düzeni kullanılan kapsayıcıların doğrudan çocukları arasında margin çakışması meydana gelmez. Bu, modern düzenlerde önemli bir avantajdır.”
}
}
]
}
CSS Margins için Sıkça Sorulan Sorular
CSS margin nedir?
CSS margin, bir HTML elementinin dış kenarlığı ile diğer elementler arasındaki boşluğu tanımlayan bir CSS özelliğidir.
CSS margin ve padding arasındaki fark nedir?
Margin, elementin dışındaki boşluğu kontrol ederken; padding, elementin içeriği ile kendi kenarlığı arasındaki iç boşluğu kontrol eder.
Margin-top, margin-right, margin-bottom, margin-left ne işe yarar?
Bu özellikler, bir elementin sırasıyla üst, sağ, alt ve sol kenarlarındaki dış boşluğu ayrı ayrı ayarlamak için kullanılır.
CSS margin shorthand (kısaltma) nasıl kullanılır?
Tek bir 'margin' özelliği ile tüm kenarları veya belirli kenar çiftlerini ayarlayabilirsiniz. Örneğin, 'margin: 10px;' tüm kenarlara 10px, 'margin: 10px 20px;' üst/alt 10px, sağ/sol 20px boşluk verir.
Margin: auto ne anlama gelir ve ne için kullanılır?
'margin: auto;' bir blok seviyesindeki elementi yatayda ortalamak için kullanılır. Elementin belirli bir genişliğe sahip olması gerekir.
Negatif margin değerleri kullanabilir miyim?
Evet, negatif margin değerleri elementleri birbirine yaklaştırmak veya üst üste bindirmek için kullanılabilir, ancak dikkatli kullanılmalıdır.
Margin çakışması (margin collapse) nedir?
Dikey olarak bitişik iki veya daha fazla blok seviyesindeki elementin marjinlerinin birleşerek tek bir marjin oluşturması durumudur. Sadece dikey marjinlerde görülür.
Margin çakışması nasıl önlenir?
Margin çakışmasını önlemek için 'display: flex', 'display: grid', 'overflow: hidden' gibi CSS özellikleri veya border/padding ekleme yöntemleri kullanılabilir.
Yüzde (%) birimleri margin için nasıl çalışır?
Yüzde birimleri, elementin içeren bloğunun genişliğine göre hesaplanır. Dikey marjinlerde de genellikle içeren bloğun genişliği referans alınır.
Em ve rem birimleri margin için neden önemlidir?
Em ve rem birimleri, yazı tipi boyutuna göre ölçeklendiği için duyarlı tasarımlarda ve erişilebilirlik açısından daha esnek ve dinamik boşluklar sağlar.
Inline elementlere margin uygulanabilir mi?
Inline elementlere yatay margin (left/right) uygulanabilirken, dikey margin (top/bottom) elementin çevresindeki diğer inline içerikleri etkilemez.
Margin değeri olarak '0' kullanmak ne anlama gelir?
Margin değeri olarak '0' kullanmak, o kenarda hiçbir dış boşluk olmayacağı anlamına gelir. Genellikle varsayılan tarayıcı marjinlerini sıfırlamak için kullanılır.
CSS margin değerlerinde hangi birimler kullanılabilir?
Piksel (px), yüzde (%), em, rem, viewport birimleri (vw, vh) ve 'auto' gibi değerler kullanılabilir.
Duyarlı tasarımda marginleri nasıl kullanmalıyım?
Yüzde, em, rem veya viewport birimleri kullanarak ve media sorguları ile farklı ekran boyutları için farklı margin değerleri belirleyerek duyarlı marginler oluşturabilirsiniz.
Margin: 0 auto; ile bir element nasıl ortalanır?
Bu kod, elementin üst ve alt marjinlerini sıfırlarken, sol ve sağ marjinlerini otomatik olarak ayarlayarak blok seviyesindeki elementi yatayda ortalar. Elementin genişliği belirlenmiş olmalıdır.
Margin çakışması parent-child ilişkisinde nasıl olur?
Bir üst elementin 'margin-top' değeri ile ilk çocuk elementinin 'margin-top' değeri arasında border, padding veya inline içerik yoksa bu marjinler birleşir.
Margin değerleri miras alınır mı?
Hayır, CSS margin değerleri varsayılan olarak miras alınmaz. Her elementin kendi marjinleri ayrı ayrı tanımlanır.
Margin ile elementler arasında boşluk oluşturmanın faydaları nelerdir?
Görsel ayrım, okunabilirlik artışı, estetik bir düzen, elementlerin doğru konumlandırılması ve kullanıcı deneyiminin iyileştirilmesi gibi faydaları vardır.
Margin değerleri tarayıcılar arasında farklılık gösterir mi?
Temel margin özellikleri genellikle tutarlıdır, ancak varsayılan tarayıcı stilleri (user agent stylesheets) bazı elementlere farklı varsayılan marjinler uygulayabilir. Bu nedenle 'reset' veya 'normalize' CSS kullanmak faydalı olabilir.
Flexbox veya Grid kullanırken margin çakışması olur mu?
Hayır, Flexbox veya CSS Grid düzeni kullanılan kapsayıcıların doğrudan çocukları arasında margin çakışması meydana gelmez. Bu, modern düzenlerde önemli bir avantajdır.
TPKmedya Ajansı ile sürecinizi hızlandırabiliriz.
Detaylar için https://www.tpkmedya.com/ adresini ziyaret edin.
