JavaScript CSS3 border-image-slice Örnek

javascript css3 border-image-slice örnek uygulama

Javascript ile border-image-slice özelliğine "25%" 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").style.borderImageSlice = "25%";
}

JavaScript css border-image-slice © htmlvecssegitimi.blogspot.com

Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

HTML s Etiketi

<s> Etiketi Örnek Artık doğru olmayan, geçersiz veya ilgisiz metni işaretleme: < p > < s > Arabamın markası Renault < /s > < /p > < p > Yeni arabamın markası Toyota < /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 Arabamın markası Renault Yeni arabamın markası Toyota HTML ve CSS Dersleri © 2015 HTMLveCSSegitimi.blogspot.com <s> Tanımı ve Kullanımı <s> etiketi artık doğru, net veya ilgili olmayan metni işaretlemek için kullanılır. <s> etiketi değiştirilmiş ya da silinmiş metni işaretlemek için kullanılmamalıdır. Değiştirilmiş vey...
Devamı Oku »

CSS text-justify Özelliği

CSS text-justify Css text-justify ile paragrafların sayfanın sağ ve sol kenarına yaslanmasını sağlayabiliriz. Örnek: div { text-align: justify; text-justify: inter-word; } Kendiniz deneyin » CSS text-justify nedir nasıl kullanılır Bu özellik metnin hangi hizada ve hangi aralıklıolması gerektiğini düzenler. CSS text-justify CSS text-justify özellikleri &nbsp Varsayılan Değer: auto   Kalıtsallık: var   Animasyon Özelliği: yok   Versiyon: CSS3   JavaScript text-justify: object.style.textJustify="inter-word" Oynat CSS text-justify Tarayıcı Desteği Tablodaki sayılar özelliği destekleyen ilk tarayıcı versiyonlarını belirtir. CSS Kodu: ...
Devamı Oku »

CSS clip uygulama

CSS clip div#kutucuk {<br>    position:absolute;<br>    background-color:lightgreen;<br>    width:85px;<br>    clip:<span id='rfrnscsscde'>auto</span>;<br>}<br> CSS clip değerleri auto rect(0px,15px,15px,0px) rect(0px,20px,20px,0px) rect(20px,30px,30px,20px) rect(5px,80px,80px,5px) rect(30px,100px,100px,30px) rect(15px,100px,100px,15px) initial Sonuç Ekranı Verilen değerlere göre kırpılan alan değişir.. Sonuçları görmek için değerlerin üzerine geliniz. HtmlveCSSEğitimi.blogspot.com
Devamı Oku »

Html belgesi yapısını anlama uygulaması

Resim
Html  dersi uygulama örneğimizde  html belgesinde temel etiketler ve kullanımını öğreneceğiz.Bu uygulama çok basit bir web sayfasının kodlarıdır.Sizlerde başlığı değiştirerek ya da paragraf etiketlerini değiştirerek kod yazmaya başlayabilirsiniz.Bir web sitesi yapmak için temel kurgu iyi bilinmelidir. <!DOCTYPE HTML> <html> <head> <title>Belge Başlığı</title> </head> <body> <h1>İçerik Başlığım</h1> <p>İlk paragrafım.....</p> </body> </html> Html belgesi uygulama videosu Bir html dökümanının uzantısı html'dir.Aşağıda izleyeceğiniz videoda sıfırdan html derslerine uygulamalarla başlamış olacağız.Videoyu izlemeden önce son hatırlatmaları yapalım. Doctype bildirimi ile tarayıcıya sitemizin html5 ile yapıldığını bildiriyoruz. Sitemiz html kodları içerisinde her elemanı kapsayan en önemli etikettir. Bizler kullanıcı olarak web sitelerinde sadece body kodları arası...
Devamı Oku »

CSS text-indent animasyon

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 css text-indent animasyon örnek Bu yazdığımız paragrafın ilk kelimesinin sayfanın solundan ne kadar içeride başlayacağını ,mesafesini ayarlayabilmemizi sağlayan bir özelliktir.Bu yazdığımız paragrafın ilk kelimesinin sayfanın solundan ne kadar içeride başlayacağını ,mesafesini ayarlayabilmemizi sağlayan bir özelliktir.. css text-indent özelliği ile paragraf girintisinin uzaklağı ayarlanabilir. css text-indent özelliğinin animasyon özelliği vardır. Hatırlatma: internet explorer 9 ve önceki versiyonları CSS animasyon özellikleri desteklemez ! ...
Devamı Oku »

CSS vertical-align Örnek

Resim
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 Html ve Css Eğitimi resmi Resimin normal hali. Html ve Css Eğitimi resmi Resime text-top değeri uygulandığında. Html ve Css Eğitimi resmi Resime text-bottom değeri uygulandığında. HTML ve CSS Dersleri © 2015 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 »

HTML5 ile SEO Uyumlu İçerik Üret

Resim
 Merhaba arkadaşlar , HTML5 ile SEO uyumlu içerik üretmek için   yapabileceğiniz çok basit ama bir blog ve web site için çok önemli olan bir kaç şeyi size paylaşıyorum. HTML5 ile SEO Uyumlu İçerik Üret Başlık Etiketlerini Etkili  Kullanın İçeriğinizi önemli anahtar kelimelerle vurgulamak için başlık etiketlerini (H1, H2, H3 vb.) kullanın. Anahtar kelimeleri bu başlık etiketlerinde yerleştirerek sayfanın yapısını anlamlı bir şekilde düzenleyin.  İçeriğinizde başlık etiketlerini (H1, H2, H3 vb.) kullanarak sayfada hiyerarşi oluşturun. Ana başlık (H1) sadece bir kez kullanılmalı ve diğer başlık etiketleri (H2, H3 vb.) alt başlıklar için kullanılmalıdır. Meta Etiketlerini Kullanmayı Unutmayın  Meta açıklama etiketini kullanarak sayfanın içeriğini özetleyin vemümkünse  anahtar kelimelerinizin en azından bir tanesi meta açıklamada bulunsun. Anahtar kelimeleri de bu açıklamada kullanarak arama motorlarının içeriğinizi daha iyi anlamasını sağlayın. Ayrıca, her...
Devamı Oku »