InternetWeb Tasarım

Mülkiyet css "şeffaflık" - site daha ilginç bir tasarım yapmak için basit bir yol

Günümüzde web sitesinin tasarımı yaratılması bir sanattır haline gelir. Bu belli bir renk ve sayfa öğelerinin sadece bir dizi değil boyutu, yazı tipi farklı tarzlarda ve tematik resimlerinin. Diğerlerinden sitenizin farklı çalımlayarak dikkat çekmek ve bazı elemanlarına yöneltmek için, yöntem ve araçlar çok sayıda kullandı. Aralarında çok popüler bir özellik css var - şeffaflık. Bu teknik oldukça şık ve göz alıcı ve bu nedenle sık sık kullanılır. örneğin metin bloğu veya tüm resim, - Şeffaflık sitenin farklı nesneler sayfalarını verebilir. Aynı zamanda farklı şekillerde elde etti. Bize bunları aşağıda inceleyelim.

Parametreler şeffaflık elemanlarını belirtmek

Parametreler birkaç unsurları şeffaflığını düzenleyecek. Onlar "düzeltilmiş" tasarım altında olan tarayıcıya yanı sıra belirli amaçlara bağlı olarak kullanılan edilmektedir. Bunlar aşağıdaki özellikleri içerir:

  • opaklık;
  • filtre;
  • Bir arka plan olarak PNG-görüntü.

aşağıdaki gibi Mülkiyet değeri css "şeffaflık" değiştirilir: yüksek sayı, elemanın şeffaflık seviyesi de düşmektedir. 10 ile 100 arasında ve ikinci Interet Explorer tarayıcısı, ve diğer ilgili opaklık özelliği için kullanılır - opaklık, bu filtrede, 0 ile 1 arasında değişir.

Şeffaflık Resmi (değiştirme)

Diyelim ki öğeyi taşıdığınızda şeffaf görünür seçenekleri ile başlayalım fareyi sürükleyerek.

Bize resmin şeffaflığını belirtmek için nasıl düşünelim. CSS iki seçenek sunar. aşağıdaki gibi Bunu yapmak için, kod html-belgede doğrudan kayıt gerekir:

    1. resmin yolunu belirtin.
    2. İmleç değilken Biz şeffaflık parametreleri tanımlayın. Bunu yapmak için, donukluk ve filtrenin değerini belirler onmouseover ve onMouseOut, özelliklerini kullanır.

    Aynı özellikleri CSS-belge ve buna bir başvuru eklemek için kaynak kodu reçete edilebilir. Sonuçlar aynı söndürmeye.

    Metin ve sayfa blokların Şeffaflık

    metin veya bloğun (saydam div) için, css şeffaf bir resim oluşturmaya benzer olan seçeneği sunuyor gibi, istenen parametreler ayarlandığı bağlı css dosyası, kullanmak zorunda. Gidip daha basit bir yolu olabilir. Eğer stil blok div style ayarlamak veya metin p için onmouseover ve elementler onmouseout aşağıdaki html kodunu reçete zaman. Her iki seçenek de çalışmak ve istenen sonucu.

    şeffaflık sabiti

    Bazı durumlarda, bir nesnenin saydamlık, sen sürekli olarak ayarlamak istediğiniz bir tasarım elemanı veya metin. Bu durumda, çözüm fare imlecini getirdiğinizde bile daha basittir.

    şeffaflık Css elemanı şu kodla verilecektir. Blok div tarzı arka (örneğin, # ff8800), donukluk (örneğin, 0.5) ve genişliği (genişlik) ve dolgu (padding) için değerleri verirler.

    resim için kod değerleri yapma ve donukluk filtresi ve görüntüye yol belirtin edilir.

    RGBA metodu

    şeffaflık herhangi bir tasarım öğesinin taban rengine uygulanabilir: Bu özellik css kullanarak diğer seçenek vardır. Bu RGBA yöntemini kullanır. şeffaflık düzeyini ayarlar alfa, - ilk üç harfi temel renkler (kırmızı, fisyon, mavi) ve son ayakta. RGBA-biçiminin kullanılması son basamağa doğrultarak, şeffaflık öngörmektedir. Örneğin, şekilde: arka: RGBA (240,2,33,0.4035).

    Sonuç

    Böylece, site tasarımı basit ama etkili özellik css "şeffaflık" konulu çalışmaları sırasında kullanarak, minimum çabayla elemanları daha ilginç ve daha fark edilebilir hale getirebilir. açıklanan düzenlemeler özel şeffaflık özellikleri bu konuda size yardımcı olacaktır vardır.

    Similar articles

     

     

     

     

    Trending Now

     

     

     

     

    Newest

    Copyright © 2018 unansea.com. Theme powered by WordPress.