CGTYMEKAN

TABLO CSS

CSS DESİGN ÖRNEK TASARIM (Resimli Anlatım)

Öncelikle resimde görüldüğü gibi Css Design Tasarımını seçiyoruz.

Css Design tasarımında menü gizleme kodunu eklememiz gereklidir.

Menü gizleme kodunu Navigasyonun baslığı: kutucuğuna yapıştırıyoruz.
Ardından Kaydet diyoruz

Css Design Menü Gizleme Kodu:

"Ayarlar" sayfasına gelerek site başlığını yok etmeliyiz.
Bunu ise site başlığı:
Yazının karşısındaki kutucuğa bir kez tıklayıp ardından
space (boşluk) tuşuna basıyoruz ve Kaydet diyoruz.

Sayfalarımı değiştir / Yeni sayfa diyoruz.

Aşağıda görüldüğü gibi araçlarımız gösteriliyor.
Tasarımımızın bir tablo içerisinde olması için aşağıdaki yolu izliyoruz.

Resimde görüldüğü dış tablomuzu yaptık.

En üste banner resmi koyacaz.
Onun için yaptığımız tablonun en üstüne banner'lık bi tablo yapacağız.

Resimde görüldüğü gibi banner resmi ekleme işlemi yapılmaktadır.
Banner boyutları 800 x 100 boyutlarında.Ona göre banner yapabilirsiniz..

Ve işte banner' ımız tablonun içine eklenmiş durumda

Şimdide dış tablomuzun içini renklendirelim.

Resimde görüldüğü gibi renk seçiyoruz...

Ve görüldüğü gibi tablomuzun içini renklendirdik.Ben gri rengi tercih ettim.
Siz hangi seçerseniz seçin.Zevkinize kalmış

Şimdide Tablomuzun sağ tarafına tablo yapalım.
Tablo yapmak için araçlarımızdan yine aynısına tıklıyoruz.
ve gelen pencereden;

Görüldüğü gibi saol tablomuzuda yerleştirmiş olduk.

Yapmış olduğumuz tablonun içine menü kutucukları koyalım.
Menü kutucukları tablo ebatları;
satırlar:1
sütunlar:1
Kenar kalınlığı:1
Genişlik:210

Kaç tane sayfamız olacaksa o kadar menü tablosu ekliyoruz ve içlerine sayfa yazılarını ekliyoruz.

Sayfa Linki Yazdığım yeri seçiyorum ve Köprü ekle aracına tıklıyorum.
Sonrası resimde görüldüğü gibi..

Tamam'a tıkladığımız anda köprü eklenmiş demektir.
Ancak Yazının rengi gördüğünüz gibi koyu mavi oldu.
Bunu tekrar eski haline yani siyah yapmak için;

Hepsine bu şekilde sayfasına göre link (köprü ekleyin).

Tasarım olarak biraz bilgi öğretmeye çalıştım.
Genel olarak bu verdiğim bilgilere dayanarak kafanızda tasarladığınız tasarımlar yaratabilirsiniz.

Son bi kaç bilgi vereceğim..
Daha önce menü gizleme kodu vermiştim.
Onu bi yere daha yapıştıracağız.
Bu kodu resimdeki yere yapıştırmazsak sitemiz görünmez haberiniz olsun...

Css Design Menü Gizleme Kodu:

Kod:

Tekrar "Kaynak" aracına tıklayarak Ctrl + A yapıyoruz.
Yani kodlarımızın hepsini seçiyoruz ve kopyalıyoruz..

Bu kopyaladığımız kodu bütün sayfalara yapıştırıyoruz.
Yapıştırıyoruz derken direk yapıştırmayın.
Öncelikle "Kaynak" aracına tıklayıp sonra yapıştırıyoruz..

Görüldüğü gibi bütün sayfalara yapıştırıyorum..

Tasarladığımız sitenin içeriklerini her sayfanın kendisine göre dolduruyoruz.

GORDUGUNUZ GIBI CSS TABLO TASARIM YAPMAK BU KADAR KOLAY....
ALINTIDIR...
ANLATIM PHOTOSHOPARA AITTIR...

TABLO CSS

Genel

Güncel

Web Dersleri

B-S Yardım