CSS renk modülü, yazarların html öğelerinin rengini ve netliğini ve ayrıca renk değerlerini belirtmesine olanak tanıyan değerleri açıkça tanımlar.
Güç rengi
1. Öncelikli renkler: parlaklık rengi
Otorite, yazı tipinin rengini çeşitli renk aktarım sistemlerini kullanarak belirler. Güç, metin öğesinin rengini ifade eder. Ayrıca renge anlam kazandıran diğer güçlere potansiyel dolaylı anlam (currentColor) sağlamak için kullanılır.
Güç azalıyor.
2. Rengin önemi
2.1. Ana anahtar kelimeler
Ana anahtar kelimelerin listesi aşağıdaki değerleri içerir:
| İsim | altıgen | RGB | Kolir |
|---|---|---|---|
| siyah | #000000 | 0,0,0 | |
| gümüş | #C0C0C0 | 192,192,192 | |
| gri | #808080 | 128,128,128 | |
| beyaz | #FFFFFF | 255,255,255 | |
| kestane rengi | #800000 | 128,0,0 | |
| kırmızı | #FF0000 | 255,0,0 | |
| mor | #800080 | 128,0,128 | |
| fuşya | #FF00FF | 255,0,255 | |
| yeşil | #008000 | 0,128,0 | |
| kireç | #00FF00 | 0,255,0 | |
| zeytin | #808000 | 128,128,0 | |
| sarı | #FFFF00 | 255,255,0 | |
| Donanma | #000080 | 0,0,128 | |
| mavi | #0000FF | 0,0,255 | |
| turkuaz | #008080 | 0,128,128 | |
| su | #00FFFF | 0,255,255 |
Renk adları büyük/küçük harfe duyarlı değildir.
Sözdizimi
Renk tonu;
2.2. Rengin sayısal değerleri
2.2.1. Colori modelleri RGB
Onaltılık formattaki RGB değer formatı # işareti ve ardından üç veya altı onaltılık karakterdir. Üç basamaklı RGB gösterimi #rgb, sıfır eklenerek değil, sayılar kopyalanarak altı basamaklı #rrggbb biçimine dönüştürülür. Örneğin, #fb0 #ffbb00'a genişler. Bu, beyaz #ffffff'in kısa bir #ffff girişinde gösterge olarak kullanılabileceğini garanti eder ve ekranın rengine bağlı tüm farklılıkları ortadan kaldırır.
İşlevsel gösterimin RGB değer formatı rgb'dir (ardından üç sayısal değerden (veya üç tamsayı değeri veya üç yüzüncü değerden) oluşan ayrı bir liste ve ardından bir sembol gelir). 255 tamsayı değeri, onaltılık gösterimde %100'e ve F veya FF'ye karşılık gelir:
RGB(255,255,255) = RGB(%100, %100, %100) = #FFF
Sayısal değerlerin yanında boş karakterlere izin verilir.
Web tasarımında rengi sunmanın çeşitli yolları vardır
HEX, renkleri 16'ya dayalı olarak sunan onaltılık bir sistemdir. Bu sistem için 16'ya kadar olan dijital sayıyı tamamlamak için 0'dan 9'a kadar Arapça onlar basamağı ve A'dan F'ye kadar Latin harfleri kullanılır. Web tasarımı için 16 ana (anahtar) renkler iv alınır, dolayısıyla on altıncı sıradadır. Renk kodu #RRGGBB'dir, burada her çift kendi parçasının rengini temsil eder: RR – kırmızı, GG – yeşil ve BB – mavi. Ten rengi 00 ile FF arasında değişir.
Web tasarımında rengin diğer iki tezahürü şunlardır: RGB(*,*,*) biçimindedir; burada rengin “*” kısmı 0'dan 255'e kadar onlarca rakamla ve renk adlarıyla temsil edilir. İngilizce.
Renkli bir görüntü oluştururken asıl sorun, renklerin farklı türdeki bilgisayarlara, monitörlere ve tarayıcılara doğru şekilde aktarılmasıdır. Tarayıcı rengi doğru görüntüleyemezse benzerini seçer veya birkaç rengi karıştırır. Veya tamamen farklı bir renkle değiştirebilirsiniz.
Masa 16 ana renk, tüm tarayıcılarda vikoristed olan
| İsim | Kolir | Altıgen | (RGB) |
| Su (morska hvilya) | #00FFFF | (000,255,255) | |
| Siyah | #000000 | (000,000,000) | |
| Mavi | #0000FF | (000,000,255) | |
| Fuşya (macenta) | #FF00FF | (255,000,255) | |
| Gri (seri) | #808080 | (128,128,128) | |
| Yeşil | #008000 | (000,128,000) | |
| Kireç (parlak yeşil) | #00FF00 | (000,255,000) | |
| Bordo (koyu bordo) | #800000 | (128,000,000) | |
| Lacivert (koyu mavi) | #000080 | (000,000,128) | |
| zeytin | #808000 | (128,128,000) | |
| Mor | #800080 | (128,000,128) | |
| Kıpkırmızı) | #FF0000 | (255,000,000) | |
| Gümüş | #C0C0C0 | (192,192,192) | |
| Deniz mavisi (gri-yeşil) | #008080 | (000,128,128) | |
| Beyaz | #FFFFFF | (255,255,255) | |
| Sarı (zhovtiy) | #FFFF00 | (255,255,000) |
Masa mor renkler ve renkler
| İsim | Kolir | Altıgen | (RGB) |
| Macenta (mor) | #FFCBDB | (255,203,219) | |
| Macenta (mor) | #FF0099 | (255,000,153) | |
| Macenta (macenta) | #F95A61 | (249,090,097) | |
| Fuşya (fuşya) | #FF00FF | (255,000,255) | |
| Movein (anilin moru) | #EF0097 | (239,000,151) | |
| Somon pembesi (turuncu-pas) | #FF91A4 | (255,145,164) | |
| Cenise (morun tonu) | #DE3163 | (153,149,140) | |
| Patlıcan Patlıcan (patlıcan) | #990066 | (153,000,132) | |
| Lavanta allık (pembe-lavanta) | #FFF0F5 | (255,240,245) | |
| Leylak (boozkoviy) | #C8A2C8 | (200,162,200) | |
| Macenta (macenta) | #FF008F | (255,000,143) | |
| Orkide (orkide) | #DA70D6 | (218,112,214) | |
| Kırmızı-mor (mor-kırmızı) | #C71585 | (199,021,133) | |
| iyimser | #92000A | (146,000,010) | |
| Devedikeni (mor tonu) | #D8BFD8 | (185,211,238) | |
| Menekşe-patlıcan (morun bir tonu) | #991199 | (153,017,153) | |
| Rosa vivo (kuluçkalanmış boynuz otu) | #FF007F | (255,000,127) | |
| Lavanta-gül (morun bir tonu) | #FBA0E3 | (108,123,139) | |
| Mountbatten pembe | #997ABD | (153,122,141) |
Masa gri renkler ve renkler
| İsim | Kolir | Altıgen | (RGB) |
| Gri (Suriye) | #808080 | (128,128,128) | |
| Gri (Suriye) | #bebebe | (190,190,190) | |
| (Siry-vidtinok) | #858585 | (133,133,133) | |
| Gray33 (Suriye-33) | #545454 | (084,084,084) | |
| (Sirogo arduvaz) | #708090 | (112,128,144) | |
| (Kuvarsovy) | #99958с | (153,149,140) | |
| (Svetlo efendim) | #bbbbbb | (187,187,187) | |
| (Sriblyasty) | #c0c0c0 | (192,192,192) | |
| (Siro-beyaz) | #f0f0f0 | (240,240,240) | |
| (Borody Abdel-Kerim) | #e0e0e0 | (224,224,224) | |
| AçıkGri (açık gri) | #d3d3d3 | (211,211,211) | |
| LightStateGray() | #778899 | (119,136,153) | |
| StateGray-1 (Blіdo-peygamber çiçeği mavisi1) | #c6e2ff | (198,226,255) | |
| StateGray-2 (Blіdo-peygamber çiçeği mavisi2) | #b9d3ee | (185,211,238) | |
| DurumGray3() | #9fb6cd | (159,182,205) | |
| DurumGray4() | #6c7b8b | (108,123,139) |
Bu sayfada, HTML, CSS, JavaScript, Flash vb. Web geliştirici dillerinde renkleri atamak için kullanılabilecek anahtar kelimelerin bulunduğu bir tablo bulunmaktadır.
Eski spesifikasyonlarda, WC3 endişesi, HTML ve CSS'ye yüklenen renklerin yanı sıra yalnızca 16 anahtar kelimeyi öngörüyordu. Ayrıca, daha güncel spesifikasyonlara, renk adlarını belirtmek için 130 anahtar kelime daha eklendi. Burada renklerin adlarını, onaltılı sistemi ve temsil ettikleri RGB kodlarını gösteren bir tablo bulunmaktadır.
CSS kurallarına uygun olarak renk adları büyük/küçük harfe duyarlı değildir. IndianRed ve IndianRed renklerinin girişleri eşittir.
Tablodaki 146 anahtar kelimeden aslında daha az renge sahip olduğunu da belirtmekte fayda var. Bu, bu anahtar kelimelerin aynı rengi ifade ettiği anlamına gelir. Bu nedenle, Gri ve Gri isimleri #808080 koduyla 50 onaltılık rengi belirtir ve Macenta kelimesi, #FF00FF onaltılık koduna karşılık gelen Fuşya HTML rengiyle eşanlamlıdır. Ayrıca Aqua ve Cyan sözcükleriyle eşanlamlı olan kokular #00FFFF koduna karşılık gelir.
|
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Renkleri ayarlamak için onaltılık kodlardaki sayılar kullanılır. Onuncu sistem yerine on altıncı sistem, adından da anlaşılacağı gibi 16 sayısını temel alır. Rakamlar görünecektir: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. 10'dan 15'e kadar olan sayıların yerini Latin harfleri alır. On altıncı sistemde 15'ten büyük sayılar iki sayının bir sayıda birleştirilmesiyle oluşturulur. Örneğin onuncu sistemdeki 255 sayısı, on altıncı sistemdeki FF sayısıyla doğrulanmaktadır. Belirtilen sayı sistemiyle karışıklığı önlemek için # sembolünü on altıncı sayının önüne koyun, örneğin #666999. Üç renkten (kırmızı, yeşil ve mavi) kaplamalar 00'dan FF'ye kadar değerler alabilir. Bu şekilde, atanan renk üç depoya #rrggbb bölünür; burada ilk iki sembol rengin kırmızı bileşenini, ortadaki iki sembol yeşili ve geri kalan iki sembol maviyi gösterir. Sembolün eklenebileceği #rgb kısa formunun kullanılmasına izin verilir. Yani #fe0 trace kaydı #ffee00 olarak değerlendirilir.
isim için
| İnternet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Tarayıcılar adlarının arkasında farklı renkleri destekler. Masada 1'de isim, onaltılık kod, RGB'deki değerler, HSL formatında ve açıklama belirtilmiştir.
| Ben | Kolir | Kod | RGB | HSL | Tanım |
|---|---|---|---|---|---|
| beyaz | #ffffff veya #ffff | rgb(255,255,255) | hsl(%0,0,%100) | Billy | |
| gümüş | #c0c0c0 | RGB(192,192,192) | hsl(0,0%,75%) | Suriye | |
| gri | #808080 | RGB(128,128,128) | hsl(%0,0,%50) | Koyu gri | |
| siyah | #000000 veya #000 | RGB(0,0,0) | hsl(0,0%,0%) | Azgın | |
| kestane rengi | #800000 | RGB(128,0,0) | hsl(0,100%,25%) | Koyu Kırmızı | |
| kırmızı | #ff0000 veya #f00 | RGB(255,0,0) | hsl(0,100%,50%) | Kızıl altın | |
| turuncu | #ffa500 | RGB(255,165,0) | hsl(38,8,100%,50%) | Turuncu | |
| sarı | #ffff00 veya #ff0 | RGB(255,255,0) | hsl(60,100%,50%) | Zhovtiy | |
| zeytin | #808000 | RGB(128,128,0) | hsl(60,100%,25%) | zeytin | |
| kireç | #00ff00 veya #0f0 | rgb(0,255,0) | hsl(120,100%,50%) | Açık yeşil | |
| yeşil | #008000 | RGB(0,128,0) | hsl(120,100%,25%) | Zeleny | |
| su | #00ffff veya #0ff | RGB(0,255,255) | hsl(180,100%,50%) | Blakitny | |
| mavi | #0000ff veya #00f | RGB(0,0,255) | hsl(240,100%,50%) | Mavi | |
| Donanma | #000080 | RGB(0,0,128) | hsl(240,100%,25%) | Koyu mavi | |
| turkuaz | #008080 | RGB(0,128,128) | hsl(180,100%,25%) | Mavi-yeşil | |
| fuşya | #ff00ff veya #f0f | RGB(255,0,255) | hsl(300,100%,50%) | Rojeviy | |
| mor | #800080 | RGB(128,0,128) | hsl(300,100%,25%) | Menekşe |
Daha fazla yardım için RGB
| İnternet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
| 5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Renk, vikory ve kırmızı, yeşil ve mavi değerlerini onda birlik olarak belirleyebilirsiniz. Üç renk bileşenine sahip dış görünüm 0 ile 255 arasında değişen değerleri alır. Ayrıca 255 sayısıyla %100 tutarlı olacak yüksek kaliteli bir renk için renk ayarlamak da mümkündür. Başlangıçta rgb anahtar kelimesi belirtilir, ve ardından bileşenleri ve renkleri söyleyen kollar için, örneğin rgb(255, 128, 128) veya RGB (%100, %50, %50).
RGBA
| İnternet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
RGBA formatı söz dizimi açısından RGB'ye benzer ancak öğenin netliğini belirten bir alfa kanalı içerir. 0 değerleri artan netliği, 1 - netlik eksikliğini ve 0,5 seviyesindeki ara değerler - artan netliği gösterir.
CSS3'e yönelik RGBA uzantıları, o sürüm için CSS kodunun kendisinin doğrulanmasını gerektirir. Lütfen CSS3 standardının hâlâ geliştirilme aşamasında olduğunu ve değişebileceğini unutmayın. Örneğin, arka plan rengi pikseline yapılan eklemelerin RGB formatının rengi doğrulamadan geçmelidir, ancak artık arka plan pikseline herhangi bir ekleme yapılmaz. Bu durumda, tarayıcılar genellikle bunun ve diğer gücün rengini doğru bir şekilde anlar.
HSL
| İnternet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSL formatı adını Hue, Saturate ve Lightness baş harflerinden alır. Renk, kazıktaki renkle aynıdır (Şekil 1) ve derece cinsinden belirtilir. 0° kırmızı, 120° yeşil ve 240° mavidir. Renk değeri 0 ila 359 arasında değiştirilebilir.
Küçük 1. Renk çemberi
Yoğunluk, rengin %0 ile %100 arasında değişen yoğunluğudur. %0 değeri, renklerin ve gri tonlarının varlığı anlamına gelir; %100 ise maksimum doygunluk değeridir.
Açıklık, rengin ne kadar parlak olacağını ayarlar ve %0 ila %100 aralığında gösterilir. Renklerin koyu ve yüksek değerlerin açık tutulması önemlidir, %0 ve %100 gibi uç değerler siyah beyaz rengi belirtir.
HSLA
| İnternet Explorer | Krom | Opera | Safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSLA formatı söz dizimi açısından HSL'ye benzer ancak öğenin netliğini belirten bir alfa kanalı içerir. 0 değerleri artan netliği, 1 - netlik eksikliğini ve 0,5 seviyesindeki ara değerler - artan netliği gösterir.
RGBA, HSL ve HSLA formatlarının renk değerleri CSS3'e eklenir, bu nedenle bu formatları değiştirirken kodun doğru sürümle geçerliliğini kontrol edin.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Peşin
Web sitesinde listelenen tüm aslan avlama yöntemleri teoriktir ve hesaplama yöntemlerine dayanmaktadır. Yazarlar, bunların kullanımında güvenliğinizi garanti etmez ve sonuçların sorumluluğunu üstlenmez. Unutmayın, aslan bir kulübedir ve dikkatsiz bir yaratıktır!
Bu poponun sonucu Şekil 2'de gösterilmektedir. 2.
Küçük 2. Web sayfasındaki Colori
Dizüstü bilgisayarlar
