Dreamweaver'da bir CSS Düzeni'nde Stilleri Düzenleme - Bir manken oluşturduktan sonra mankenler

Dreamweaver'da CSS düzenine sahip yeni bir sayfa oluşturduktan sonra, bunu düzenlemek için görünüşte sınırsız sayıda seçeneğiniz var, ancak önce stil sayfasındaki hangi stilleri düzenlemek istediğiniz öğelere karşılık geldiğini belirlemelisiniz.

Muhtemelen hayal edebileceğiniz gibi, kendi tasarımlarınızı yaratmak için bir CSS düzeninde stilleri çeşitli şekillerde düzenleyebilirsiniz.

Temel sayfa tasarımını istediğiniz gibi ayarlamak için mevcut stilleri ayarladıktan sonra, istediğiniz sayıda stil oluşturabilirsiniz.

Kullanılabilir stilleri kontrol etme ve temel düzenlemeler yapma

Aynı temel talimatları Dreamweaver'da bulunan herhangi bir CSS düzeninde kullanabilirsiniz. CSS düzeninde stilleri düzenlemek için şu adımları izleyin:

1. Bir Dreamweaver CSS düzeninde bulunan bir sayfa dosyasını açın ve Pencere → CSS Stilleri'ni seçin (veya paneli genişletmek için CSS Tasarımcı sekmesini tıklatın).

   CSS Tasarımcısı paneli açılır veya genişler.

2. CSS Tasarımcısının en üstündeki Kaynaklar panelinde stil sayfasının adını seçmek için tıklayın.

   Yeni sayfa ile ilişkili tüm stiller Seçiciler panelinde listelenir.

   

3. CSS Tasarımcısı Seçici panelinde listelenen herhangi bir stilin adını seçin.

   Stil için tanımlanan ilgili CSS kuralları, CSS Designer panelinin altındaki Özellikler panelinde görüntülenir. Stiller listesine tıklamak ve ilgili kurallarını incelemek, tasarıma hızlı bir bakış sağlamak ve çeşitli sayfa formatlama seçeneklerinin nerede saklandığını görmek için iyi bir yoldur.

HTML5 başlığı,. nav ve altbilgi etiketleri sayfanın ana bölümlerini kontrol eder. Örneğin, başlık stili, arka plan rengini yeşil yapan bir kural içeriyor. Böylece, sayfanın üstündeki başlık alanının rengini değiştirmek için, başlık kuralındaki arka plan rengi ayarını değiştirirsiniz.

Sayfa genişliği ayarlarını düzenleme hakkında

Sayfanın arka plan rengini veya ana yazı tipi yüzünü, boyutu ve sayfanın genelinde kullanılan metnin rengi gibi sayfa genişliğindeki ayarları düzenlemek için şu adımları izleyin:

1. CSS Tasarımcı Seçicileri panelinde, gövde adlı stili seçin.

   Seçilen stil kuralında tanımlanan özellikler, Özellikler panelinde görüntülenir.

   

2. Özellikler panelinin üst kısmındaki T simgesini tıklayın ve istediğiniz yazı tipi ve diğer metin ayarlarını değiştirin veya ekleyin.

   Yazı tipi yüzünü, boyutunu, stilini ve ağırlığını değiştirebilirsiniz. Metin satırları arasındaki boşluğu değiştirmek için satır yüksekliğini değiştirin.

3. Aşağı doğru kaydırın, Özellikler panelinin Arka Plan alanına gidin ve sayfanın arka planının tamamı için bir renk belirtmek için Arka Plan Rengi alanındaki renk kuyruğunu kullanın.

   Alternatif olarak, Artalan-Renk alanına herhangi bir onaltılık renk kodu girebilir veya herhangi bir rengi örneklemek için damlalık kullanabilirsiniz. Arka plan resmi eklemek için, Arka Plan bölümündeki URL alanını tıklayın ve ardından görünen Göz At düğmesini tıklayın ve arka plan olarak sunmak istediğiniz resmi seçin. Arka plan resminin sayfada nasıl tekrarlanacağını belirlemek için Arka Plan Tekrar simgesini kullanın.

4. Stil kuralı için başka herhangi bir değişiklik veya ekleme yapın.

Özellikler panelindeki stil kurallarındaki değişiklikler otomatik olarak kaydedilir ve kuralla biçimlendirilmiş içeriğe uygulanır.

İçerik alanlarını nasıl özelleştireceksiniz

Sayfanın genel boyutunu ve üstbilgi, altbilgi ve kenar çubuğunu denetleyen ana içerik alanlarının genişliğini veya diğer ayarlarını değiştirmek için şu adımları izleyin:

1. Değiştirmek için tüm ana tasarım alanının genişliği:

   1. . konteyner stilini CSS Tasarımcı panelinin Seçiciler panelinde ayarlayın.

      . konteyner stili kuralı, stili de düzenleyebileceğiniz Özellikler panelinde görüntülenir.

   2. Genişlik alanındaki boyutu değiştirin veya istediğiniz sayfa genişliği için yeni bir sayı yazın.

      Sayfa tasarımının genişliği, girdiğiniz boyuta bağlı olarak otomatik olarak değiştirilir. Genişliğini değiştirirken. konteyner stili, tüm tasarımın genişliğini değiştirirsiniz, çünkü tüm etiketler ve diğer öğeler ile biçimli olarak bulunur. konteyner tarzı - ve hepsi doldurmak için genişletmek için ayarlanır. bir kap.

2. Sayfanın içerik alanının boyutunu değiştirmek için adlı stili seçin. içeriğini seçin ve istediğiniz boyut ve diğer seçenekleri Seçenekler panelinde belirtin.

   İçerik alanının genişliğini, kenar çubuğu içeren bir düzen içinde değiştirirseniz, kenar çubuğunun genişliğini de değiştirmeniz gerekir.

3. Sayfadaki herhangi bir stilin arka plan rengini değiştirmek için, ilgili stilin adını tıklayın ve Özellikler panelinin Arka Plan bölümündeki ayarları değiştirin.

   Örneğin, Dreamweaver'daki CSS düzenlerinde, kenar çubuğu adlı bir stilde tanımlanır. sidebar1. Böylece, arka plan rengini değiştirmek için, tıklarsınız. Kenar Çubuğu1 Seçiciler panelinde, Özellikler panelinde Arka Plan kategorisini seçin ve istediğiniz rengi seçin. Benzer şekilde, başlığın arka plan rengini değiştirmek için, Seçiciler panelinde başlık başlıklı stili seçin ve renk kuyusunu kullanın.

   

4. Üstbilgiye bir resim eklemek için:

   1. Insert Logo (Logo Ekle) etiketli yer tutucu resmini seçin ve Delete veya Backspace tuşuna basın.

   2. Ekle → Görüntü → Resim'i seçin ve Görüntü Kaynağını Seç iletişim kutusunu kullanarak bir resim seçin.

5. Metni değiştirin ve kenar çubuğunda ve ana içerik alanlarına resim ekleyin.

   Herhangi bir web sayfasında yaptığınız gibi, bir CSS düzeninden oluşturulan herhangi bir sayfaya metin ekleyebilir veya değiştirebilir veya resim ekleyebilirsiniz.

6. Sayfayı ve stilleri kaydetmek için Dosya → Tümünü Kaydet seçeneklerini belirleyin.