DERSLER – BilgeBank
Anasayfa / DERSLER

DERSLER

DERSLER

CSS3 Dersleri 2 border-radius Kenar Yuvarlama

CSS3 ile birlikte gelen border-radius özelliğimiz, HTML etiketlerinin kenarlarını yuvarlamak, oval yapmak için kullanılır. Web tasarımda artık bu özellik sıklıkla kullanılıyor, Daha önceleri bu özelliği javascript kütüphanesi ve eklentileriyle kenar yuvarlama işlemleri yapılıyordu.  Artık CSS3 ile gelen border-radius özelliğini kullanmamız yeterli oluyor. Hemen örneğimize geçerek uygulamalı şekilde border-radius özelliğimizi inceleyelim. CSS3 …

Devamını Oku »

CSS3 Nedir? CSS3 İle Gelen Yenilikler Nelerdir?

CSS3 Görseli

Öncelikle CSS neydi onu hatırlayalım; CSS, HTML Kodlarımızdaki metin ve format etiketlerimize görsellikte zenginlik katmamızı olanak sağlayan web teknolojisidir. CSS3 Yeni bir teknolojimidir? CSS3 daha önceki sürümleri üzerine geliştirilmiş üçüncü sürümüdür. CSS3 Nasıl Kullanılır? CSS3 kodları CSS de olduğu gibi HTML kodlarının içine de yazılabilir veya ayrı bir CSS dosyası …

Devamını Oku »

HTML5 Canvas Etiketi ( 18.Ders Canvas İle Metin Oluşturma )

Canvas Etiketimizle metin yazdırmak için 2 seçeneğe bakacağız biri dolgulu yazım biçimi FillText metodu diğeri içi boş strokeText metotlarıyla canvas alanımıza metin ekleyeceğiz. İlk Olarak Canvas alanımızı belirliyoruz. <canvas id="resimalani6" width="500" height="500" style="border:1px solid #000000"></canvas> Oluşturduğumuz canvas alanına id=”” ile mutlaka tanımlayıcı bir isim oluşturmamız gerekiyor JavaScrip ile kodlarımızı bu alanda göstermek …

Devamını Oku »

HTML5 Canvas Etiketi ( 17.Ders Canvas İle Renklendirmeler)

<canvas> Etiketimizle Renklendirmeler Yapacağız Bunun İçin 2 Metot Kullanacağız biri Düz Renk Geçişleri Sağlayacağımız createLinearGradient diğeri oval geçiş sağlayabileceğimiz createRadialGradient metotlarımızla renklendirmeler yapacağız. Fazla Uzatmadan hemen örneğimize bakarak nasıl renk geçişleri sağlayacağımıza bakalım.. Gradient Kullanımları createLinearGradient(x,y,x1,y1) createRadialGradient(x,y,r,x1,y1,r1) İlk Olarak Canvas alanımızda düz geçişleri sağlayacağımız createLinearGradient metodumuzu kullanalım bunun için Canvas İle Bir Çalışma Alanı …

Devamını Oku »

HTML5 Canvas Etiketi ( 16.Ders Canvas İle Çember ve Oval Cizimler )

<canvas> Etiketimizle Çember ve Oval Çizimler İçin arc Metodumuzu Kullanıyoruz Bu Metotları JavaScript Derslerimizde Tekrar Ederek ve Çeşitli Metotları Öğrenerek Daha Güzel Tasarımlar Oluşturabiliriz. arc(x,y,r,start,stop) metodunda tanımlamamız bu şekilde olacak İlk Olarak Canvas İle Bir Çalışma Alanı oluşturalım <canvas id="resimalani3" width="500" height="500" style="border:1px solid #000000"></canvas> Oluşturduğumuz canvas alanına id=”” ile mutlaka tanımlayıcı …

Devamını Oku »

HTML5 Canvas Etiketi ( 15.Ders Canvas Yol Belirleme )

<canvas> Etiketimiz İçinde Çizim Yollarını Belirlemek için Hemen Örneğimize Geçelim İlk Olarak Canvas İle Bir Çalışma Alanı oluşturalım. <canvas id="resimalani2" width="500" height="500" style="border:1px solid #000000"></canvas> Oluşturduğumuz canvas alanına id=”” ile mutlaka tanımlayıcı bir isim oluşturmamız gerekiyor. JavaScrip ile kodlarımızı bu alanda göstermek için bu isimi kullanacağız. width=”” height=”” style=”” ile …

Devamını Oku »

HTML5 Canvas Etiketi ( 14.Ders Canvas İle Çalışma Alanı Oluşturma)

Canvas İle Çalışma Alanı Oluşturma

<canvas> Etiketimiz web sayfalarında çeşitli grafikler oluşturmamıza ve geometrik çalışmalar yapabilmemiz için div gibi çalışma alanını belirleyen tutucudur . Canvas etiketimizi resim yapmak için kullandığımız boş bir sayfa olarak düşünebilirsiniz bunun üzerine resimi yapabilmek için bir ressama ihtiyacımız var buda javascript veya buna benzer kodlama dilleri olabilir. Javascrip Bildiğinizi varsayarak …

Devamını Oku »

HTML5 hgroup Etiketi ( 13.Ders h1…h6 Etiketlerini Guruplandırma)

hgroup

<hgroup> Etiketimiz Sayfamızda birden fazla alt alta başlık tanımlayacağımız zaman kullanılır.  

Devamını Oku »

HTML5 Embed Etiketi ( 12.Ders İçerik Çekme )

bilgebank logo

<embed> Etiketimizle Sayfanız Dışında Başka Bir Sayfadan veya Alandan Kaynak, İçerik, Eklenti Gibi Birçok Özelliği Sayfamıza Dahil Etmemize Yarayan Etiketimizdir. Diyelim ki Bilgebank Sitemizin Logosunu Sayfanıza dahil etmek istiyorsun <embed> etiketimiz içinde src=” ile çekmek istediğiniz alanın url adresini belirliyorsunuz  height=”” width=”” Değerleri ile de boyutunu ayarlayabilirsiniz.

Devamını Oku »

HTML5 Progress Etiketi ( 11.Ders Bar Göstergesi )

html gösterge alanı

<progress> Etiketimiz Bir görevin, işlemin ilerleme veya tamamlanma sürecini görsel olarak göstermemizi sağlayan çok kullanışlı bir etiketimizdir. Etiketimizde 2 Özellik Tanımlamamız Yeterlidir max=”” belitgecimizle Son Durum Değerini value=”” Değerinde İse Mevcut Değerini Belirtebilirsiniz.

Devamını Oku »

HTML5 Video Etiketi ( 10.Ders Video Oynatıcısı )

html video oynatıcısı

<video></video> etiketimiz bir HTML belgesinde video elementini oynatmak için kullanılır.  Kullanımı Çok Basit ve Kullanışlıdır. src=”” İle İçeriğimizin Dosya Yolunu Belirtiriz. type=”” İle de Dosya Formatımızı Belirleriz controls=”controls” Komutumuz İle video Özelliğimizin Başlat, Durdur, Ses, İndirme, Tam Ekran Gibi Özelliklerinin Görünmesini Sağlar. autoplay=”autoplay” Komutumuz İle video Özelliğimizin Tarayıcı Açıldıktan Sonra Otomatik Olarak Başlamasını Sağlar. …

Devamını Oku »

HTML5 Audio Etiketi(9.Ders Ses Dosyası Oynatıcısı)

mp3 Oynatıcı

Audio etiketimiz isminden de anlaşıldığı gibi ses dosyalarını web sayfalarımızda çalıştırmamıza yarar 3 ses formatını destekler. Ancak tarayıcılarda farklılık gösterebilir desteklediği ses formatları mp3, wav, ogg formatlarıdır mp3 formatı tüm tarayıcılarda sorunsuz çalışır. <audio > <source src="http://www.bilgebank.com/wp-content/uploads/2017/10/Ed-Sheeran-Shape-of-You.mp3" type="audio/mp3"> <p style="color:red;">Tarayıcınız Audio Etiketini Desteklememektedir.</p> </audio> src=”” İle Dosya Yolumuzu Belirtiriz. type=”” İle de Dosya …

Devamını Oku »

HTML5 Figure ve Figcaption Etiketleri(8.Ders figure ve figcaption Kullanımı)

Gece uykusu önemlidir

Figure Etiketimiz Article Etiketimizin Tam Tersi Olarak Bu Alanın Resim Alanı Olduğunu Belirtmemiz İçin Kullanılır.. Article Alanımız da İçerik Olarak Yazı Kullandığımızı Tarayıcılara Belirtirken figure Etiketimizle Bu Alanda Resim Alanı Olduğunu Tarayıcılara Belirtiyoruz.. figcaption Etiketimiz İse figure Alanında Oluşturduğumuz Görsele Açıklama Eklememiz İçin Oluşturduğumuz Tanımlama Etiketidir. figcaption İle resim alanlarımızı …

Devamını Oku »

HTML5 mark Etiketi (7.Ders Mark Etiketi Kullanımı)

mark Etiketi Yazı Renkelndirme

Mark Etiketi Yazılarınızda ki Dikkat Çekmeniz Gereken Alanları Renklendirmenize ve Önem Kazandırmanıza yarar.. Bu Etiketin Yapmış Olduğu İşlemi Css Kullanarak da yapabilirsiniz .Ancak Bu Özeliği Etiket İçinde Hazırlamanız Hem Sizin İçin Kolaylık Hemde Arama Motorlarının Dikkatini Çekmek İçin Extra Bir Önem, Detay Olduğunu Vurgulamanıza Yarayacak Bir Etiket Olarak Kullanabilirsiniz. <p> Mark Etiketini Yazı içinde Kullanmak İstediğiniz Kelimelerin Başında …

Devamını Oku »