|
|
15 Ocak 2025, 16:19
| #1 |
| Emektar Üye    Üyelik Tarihi: 05 Aralık 2024 Üye No: 126 Mesajlar: 1.344 Nerden: İstanbul Anadolu Cinsiyet: Erkek Takım: Takım Tutmuyor Aldığı Beğeni: 1213 Beğendikleri: 212 |  CSS Nedir? CSS Kodları Nelerdir? Profesyonel bir web sitesine sahip olmanın, para ve zaman gerektirdiği düşünülse de HTML, CSS, PHP gibi çeşitli kodlama dilleri ile son derece modern ve benzersiz web siteleri tasarlanabilir. CSS, web sayfalarını biçimlendirmek için HTML’nin tamamlayıcısı olarak kullanılan bir dil olduğundan, CSS nedir? CSS kodları nelerdir? sorularını yanıtlamadan önce HTML’nin ne olduğunu netleştirmekte yarar var. HTML (Hypertext Markup Language) web sitenizin tanımladığınız formatta ve istediğiniz gibi görünmesini sağlayan bir bilgisayar dilidir. WordPress gibi birçok site oluşturucu, hazır şablonlar arasından seçim yapma ve ögeleri “sürükleyip bırakarak” web sayfalarını geliştirme olanağı sunar. Ancak daha fazla özelleştirme gerektiren web siteleri için HTML ve CSS’e ihtiyaç duyulur. CSS Nedir? CSS (Cascading Style Sheet) açılımı “Basamaklı Stil Sayfaları” anlamına gelen web sayfalarında “yazı tipi, renk, boyut, arka plan ve dokular” gibi ögelerde arzu edilen değişiklikleri tanımlamanızı sağlayan bir programlama dilidir. CSS ile düşen karlar, uçan kuşlar, loading (yükleniyor) simgesi gibi animasyonlar yaparak web sitelerine şık detaylar eklemek mümkündür. Dahası CSS kullanarak sitenizin cep telefonu, masaüstü ve tablet gibi farklı cihazların ekranlarında nasıl görüneceğini kontrol edebilirsiniz. CSS, HTML’de kullanılan başlık, paragraf gibi elementlerin (tag) nasıl görüneceğini bildirir. Web sayfanızın her bir öğesine ayrı bir stil vermek için CSS kullanabilirsiniz. CSS, web sayfanız üzerinde tümüyle kontrol sahibi olmanızı sağlar ve istediğiniz şekilde değişiklikler yapmanıza olanak verir. CSS Kodları Nelerdir? CSS ile bir web sayfasında görünmesini istediğiniz her tür öge için kod yazılabilir. Başlık (Heading) Arkaplan (Background) Yazı Tipi (Font Style) Paragraf (Paragraph) Kenarlık (Border) Pozisyon (Position) Bağlantı (Link) Liste (List) Tablo (Table) Metin (Text) Form Dış Çizgi (Outline) Çerçeve (Box) gibi çok sayıda CSS kodu bulunur. Eğer bir web sayfasının belirli bir paragrafını italik ve mavi yapmayı tercih ederseniz; alttaki kodu sayfanıza eklemeniz gerekir. Tahmin edeceğiniz üzere burada, P; paragraf, Parantez: detayların tanımlandığı bölüm, font-weight: yazı tipine karşılık gelir. P { color:blue; font-weight:italic; } CSS Renk Kodları CSS renk kodları “Head” bölümünde <style> etiketleri arasında, aşağıdaki tablodaki gibi; hex formatında (#RRGGBB), Desimal kod formatında (R, G, B) ya da renk ismiyle (aqua, turquoise…) yazılarak kullanılabilir. css renk kodları Şimdi yukarıdaki renk kodlarının kullanıldığı CSS örneklerine göz atalım mı? Bir metnin arka planını renklendirmek için yukarıdaki kodu kullandığınızda sonuç aşağıdaki gibi görünecektir. Alt başlığınızın turkuaz görünmesini isterseniz aşağıdaki CSS kodunu yazabilirsiniz. CSS Nasıl Kullanılır? CSS stilleri HTML şablonunuzun her öğesine ayrı ayrı eklenebilir ama CSS birden çok stil bir öğeye ya da bir stil birden çok sayfaya uygulamak gibi daha pratik özellikleriyle ünlüdür . Örneğin; tüm H2 başlıklarının aynı renkte gösterilmesini sağlayabilirsiniz. CSS kodları HTML’ye üç farklı şekilde eklenebilir: Satır İçi (inline) / Yerel CSS: Satır içi CSS ile sadece o etiketi etkileyecek biçimler verilebilir, <head> etiketleri arasındaki <style> </style> etiketlerinin içine yazılır. satır içi css örnek Sayfa İçi / Genel CSS: Sayfa içinde belirli bir etiketi gördüğü her yerde, tanımlanmış özellikleri uygular. Genel CSS kodları, <style> </style> etiketlerinin arasına yerleştirilir. Sayfalarınızın geç yüklenmesine neden olabilir. Alttaki gibi bir CSS koduyla sayfadaki tüm paragrafların ya da başlıkların aynı renk olmasını sağlayabilirsiniz. genel css örnek Harici (External) CSS: Head etiketleri içinde harici bir CSS dosyasına link vererek, bir CSS dosyasının HTML dosyasına eklenmesi yöntemidir. Birden fazla sayfada aynı .css dosyasının kullanılması mümkündür. Harici CSS dosyanız yüklenene kadar sayfanız düzgün görünmeyebilir. Yukarıdaki CSS dosyası, aşağıdaki HTML dosyasına eklenen bir bağlantı ile dahil edilmiştir. harici css örnek Harici CSS, HTML sayfalarının boyutunu küçülttüğü için ve sayfaların hızlı yüklenmesine neden olduğu için web sayfalarında sıklıkla kullanılan bir CSS ekleme yöntemidir. |
|
| Konuyu yanıtla |
| Seçenekler | |
| Stil | |
| |
| Forum | Bilgilendirme | Sosyal Medya |
|
Powered by vBulletin® Version 3.8.11 Copyright ©2000 - 2025, Jelsoft Enterprises Ltd. Bu Forum Lisanslı Vbulletin Ürünü Kullanmaktadır. | Sitemiz bir " paylaşım " sitesidir. Bu yüzden sitemize kayıt olan herkes kontrol edilmeksizin mesaj/konu/resim paylaşabilmektedir. Bu sebepten ötürü, sitemiz üzerinden paylaşılan mesajlar, konular ve resimlerden doğabilecek olan yasal sorumluluklar paylaşan kullanıcıya aittir. Web sitemiz hiçbir yasal sorumluluk kabul etmemektedir. Illegal herhangi bir faaliyet görülmesi durumunda Yöneticilere adresine mail atıldığı taktirde mesaj, konu ya da resim en fazla 24 saat içerisinde silinecektir. | BeSte |
1Beğeni(ler)
Normal
