CSS margin-right Özelliği

CSS margin-right

Css margin-right özelliği ile bir elemanın sağ kenarına diğer elemanlara yaklaşabilme mesafesi ayarlanabilir.. Negatif değer de izin verilir.

Örnek:

Bu örnekte bir paragrafa margin-right:200px; değeri uygulanarak özelliğin etkisinin öğrenilmesi amaçlanmıştır

p.mrgnright { margin-right: 200px; background-color: yellow; }

CSS margin-right nedir nasıl kullanılır

Margin-right değeri ile bir html elemanın sağ sınırı(kenarı) referans alınarak sayfanın sağından veya yanındaki html elemanından girilen değer kadar uzaklaşır.Bu özelliği uygularken negatif değerlerde verilebilir.

CSS margin-right CSS margin-right özellikleri  
Varsayılan Değer: 0  
Kalıtsallık: yok  
Animasyon Özelliği: var
Versiyon: CSS1  
JavaScript margin-right: object.style.marginRight="150px"

CSS margin-right Tarayıcı Desteği

Tablodaki sayılar özelliği ilk destekleyen tarayıcı versiyonlarıdır..

CSS Kodu:
margin-right 1.0 6.0 1.0 1.0 3.5

CSS margin-right Değerleri

margin-right: length|auto|initial|inherit;

CSS margin-right özelliği değerleri

CSS margin-right değerleri CSS margin-right değerleri tanımları CSS örnek uygulamalar
length Sayısal px,cm gibi değer verilir.
% Yüzde değeri verilir.
auto Tarayıcı bu margin değerini otamatik olarak ayarlar.
initial Bu özelliğin varsayılan değeridir.
inherit Kalıtsal olarak aldığı değerdir.  

Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

HTML link Etiketi

<link> Etiketi Örnek Harici bir stil dosyasına bağlanma: < head > < link   rel= "stylesheet" type= "text/css" href= "googledrive.css"/> < /head > Kendiniz deneyin » htmlvecssegitimi.blogspot.com Kodu Çalıştır butonuna tıklayarak HTML belgesini Sonuç Ekranı'nda görüntüleyebilirsiniz. KODU ÇALIŞTIR SAYFAYI TEMİZLE SAYFAYI YENİLE KAYNAK KODLARI SONUÇ EKRANI Bu başlık link verilmiş bir stil dosyasıyla biçimlendirildi. Bu paragraf ve sayfa arka planı da aynı şekilde biçimlendirildi. HTML ve CSS Dersleri © 2015 HTMLveCSSegitimi.blogspot.com <link> Tanımı ve Kullanımı <link> etiketi bir belge ile harici kaynak arasındaki bağlantıyı belirtir. <link> etiketi harici kaynaklı stil dosyala...
Devamı Oku »

HTML html Etiketi

<html> Etiketi Örnek Basit bir HTML5 belgesi: < !DOCTYPE   html > < html > < head > < title > Belgenin başlığı < /title > < /head > < body > Belgenin içeriği.............. < /body > < /html > Kendiniz deneyin » htmlvecssegitimi.blogspot.com Kodu Çalıştır butonuna tıklayarak HTML belgesini Sonuç Ekranı'nda görüntüleyebilirsiniz. KODU ÇALIŞTIR SAYFAYI TEMİZLE SAYFAYI YENİLE KAYNAK KODLARI SONUÇ EKRANI Belgenin başlığı Belgenin içeriği.............. HTML ve CSS Dersleri © 2015 HTMLveCSSegitimi.blogspot.com <html> Tanımı ve Kullanımı <html> etiketi tarayıcıya kendisinin bir HTML belgesi olduğunu söyler. <html> etiketi HTML belgesinin kaynağını temsil eder. <html> etiketi,...
Devamı Oku »

JavaScript CSS3 border-right Örnek

javascript css3 border-right örnek uygulama bu div kutusunun sağ kenarına stil atayacağız.Şimdi tuşa basınız. Javascript ile border-right özelliğine "3px dotted blue" değeri verildiğindeki etkisini görmek için aşağıdaki çalıştır tuşuna basınız ! function fonk() { document.getElementById("anakutu").borderRight ="3px dotted blue"; } Çalıştır JavaScript css border-right © htmlvecssegitimi.blogspot.com
Devamı Oku »

HTML CSS margin Örnek

<!DOCTYPE html> <html> <head> <style> p { border: 2px solid red; padding: 15px; margin: 40px; } </style> </head> <body> <h1>Bu bir başlık</h1> <p>Bu bir paragraf....</p> <p>Bu bir paragraf....</p> <p>Bu bir paragraf....</p> </body> </html>
Devamı Oku »

HTML label Etiketi

<label> Etiketi Örnek Etiketleriyle birlikte üç radio butonu: < input type= "radio" name= "diller" id= "dil1"/> < label for= "dil1"> İngilizce < /label >< br/ > < input   type= "radio"   name= "diller"   id= "dil2"/> < label   for= "dil2"> Almanca < /label >< br/ > < input   type= "radio"   name= "diller"   id= "dil3"/> < label   for= "dil3"> Türkçe < /label >< br/ > < br/ > < input type= "submit" value= "Onayla"/> Kendiniz deneyin » htmlvecssegitimi.blogspot.com Kodu Çalıştır butonuna tıklayarak HTML belgesini Sonuç Ekranı'nda görüntüleyebilirsiniz. KODU ÇALIŞTIR SAYFAYI TEMİZLE SAYFAYI YENİLE KAYNAK KODLARI SONUÇ EKRANI ...
Devamı Oku »

JavaScript CSS counter-reset Örnek

javascript css counter-reset özelliği örnek uygulama HTML CSS Javascript Javascript ile counter-reset özelliğine "section"; değeri verildiğindeki etkisini görmek için aşağıdaki çalıştır tuşuna basınız ! function fonk() { document.getElementById("anakutu").counterReset = "section"; } Çalıştır JavaScript css counter-reset © htmlvecssegitimi.blogspot.com
Devamı Oku »

Html dersleri

Resim
Html dersleri ne  kaldığımız yerden devam ediyoruz ve artık bir webmaster ya da kodyazarı olma yolunda adım adım ilerleyeceğiz.Bir önceki derste html konusunda basit bir başlangıç yapmıştık.Şimdi ise bir kaç hatırlatmayla kod editörlerini kullanarak ders anlatımına devam edeceğiz.Kodlama öğrenmek istiyorum mu demiştiniz? HTML' in açılımı H yper T ext M arkup L anguage yani Güçlü metin işaretleme dili de denebilir.Bu kelimeyi sıkça duyacağınız için açılımını bilmekte  yarar var.İnternet sayfaları yapamamızı sağlayan bu dil ile en basit haliyle bir web siteyi aşağıdaki kodlamıştık. <html> <head> <title> Belge başlığı </title> </head> <body> <h1> İçerik Başlığı </h1> <p> Bir paragraf........ </p> <p> Bir başka paragraf........ </p> </body> </html> Şimdi ise yukarıda gördüğünüz kodları editörde çalıştırarak test edin.Eğer kendi kullana...
Devamı Oku »

HTML q Etiketi

<q> Etiketi Örnek Alıntı yapma: < p > Atatürk < q > Biz kimsenin düşmanı değiliz, yalnız insanlığın düşmanı olanların düşmanıyız < /q > sözüyle eşsiz bir insan sevgisinden, insan saygısından bahsetmiştir. < /p > Kendiniz deneyin » htmlvecssegitimi.blogspot.com Kodu Çalıştır butonuna tıklayarak HTML belgesini Sonuç Ekranı'nda görüntüleyebilirsiniz. KODU ÇALIŞTIR SAYFAYI TEMİZLE SAYFAYI YENİLE KAYNAK KODLARI SONUÇ EKRANI Atatürk Biz kimsenin düşmanı değiliz, yalnız insanlığın düşmanı olanların düşmanıyız sözüyle eşsiz bir insan sevgisinden, insan saygısından bahsetmiştir. HTML ve CSS Dersleri © 2015 HTMLveCSSegitimi.blogspot.com <q> Tanımı ve Kullanımı <q> etiketi alıntıyı ifade eder. Normalde tarayıcılar alıntının ba...
Devamı Oku »

HTML cite Etiketi Örnek

<!DOCTYPE html> <html> <body> <p>HTML blockquote öğesi bir eserin, çalışmanın adını tanımlar.</p> <p>Tarayıcılar blockquote öğelerini genellikle italik yazı stilinde gösterir.</p> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisJOGtDKN102pM-mLGnXMq4iPqxc6Ef5bz6lh2NyIfBemgT4F0lY5xSS_1p-1euZ5kbYgvT1g7j01-vj34XFVBize6Y6qkAq8rx9F7eFdWKGcEVyze3CKCCwayh2rmm9FaOd2zM322Ig/s320/aynanin-onundeki-kiz.jpg" /> <p><cite>Aynanın Önündeki Kız</cite> Pablo Picasso'nun 1932'de tamamladığı eseri.</p> </body> </html>
Devamı Oku »