Video: Dreamweaver - Ders 7 - Mevcut CSS kurallarına müdahale etmek 2024
Dreamweaver kullanan birçok tasarımcıdan hoşlanıyorsanız, muhtemelen bir web sayfasındaki tüm bağlı metinlerin altında otomatik olarak görünen alt çizgiden hoşlanmazsınız. Dreamweaver'ın Sayfa Özellikleri iletişim kutusuyla bağlantıların renk, yazı tipi ve boyutunu değiştirmek için alt çizgiyi kaldırmanız gerçekten kolaydır. Ayrıca, Sayfa Özellikleri iletişim kutusundan arka plan rengi ve sayfa kenar boşlukları gibi diğer sayfa genişliğindeki ayarları değiştirebilirsiniz.
Tüm bağlantı stillerini bir kerede değiştirmenin en kolay yolu Sayfa Özellikleri iletişim kutusunda bunları değiştirmektir. Bu seçeneği kullandığınızda, Dreamweaver ilgili etiket seçici stillerini otomatik olarak oluşturur ve bunları CSS Stilleri panelinde listeler. Bu iletişim kutusundaki diğer sayfa genelindeki ayarlar benzer şekilde çalışır ve tüm bu seçenekleri CSS araçlarını kullanarak düzenleyebilirsiniz.
Sayfa Özellikleri iletişim kutusuyla köprüyü ve diğer stilleri değiştirmek için mevcut bir sayfayı açın veya yenisini oluşturun ve şu adımları izleyin:
-
Değiştir → Sayfa Özellikleri'ni seçin.
Alternatif olarak, Özellik denetçisindeki Sayfa Özellikleri düğmesini tıklatabilirsiniz. Sayfa Özellikleri iletişim kutusu görüntülenir.
-
Sayfa Özellikleri iletişim kutusunun solunda, Bağlantılar (CSS) kategorisini seçin.
-
Bağlantılarınız için bir yazı tipi ve boyut belirtin.
Sayfanızdaki metnin geri kalanında kullandığınız gibi, bağlantılar için aynı yazı tipi boyutunu ve yüzünü kullanmak istiyorsanız, bu seçenekleri boş bırakmanız en iyisidir. Ardından, sayfanın metin ayarlarını değiştirirseniz, bağlantılar için de bunları değiştirmeyi unutmanız gerekmez.
-
İlgili renk kuyucuğunu tıklayıp Renk iletişim kutusundan bir renk seçerek her bir köprü durumu için renk belirtin.
Bağlantı renk ayarlarının herhangi birini veya tümünü değiştirebilirsiniz. Bir bağlantı rengi belirtmezseniz, tarayıcı varsayılan bağlantı rengini kullanır. Dört bağlantı durumunun her birinin bir açıklaması aşağıda verilmiştir:
-
Bağlantı Rengi: Sayfa ilk yüklendiğinde ve bağlantı verilen sayfa henüz tarayıcı tarafından ziyaret edilmediğinde bağlantılarınızın göründüğü renk. İlgili HTML etiketi.
-
Ziyaret Edilen Linkler: Bir tarayıcı bağlantı verilen sayfayı zaten görüntüledikten sonra bağlantılarınızın rengi değişir. İlgili HTML etiketi.
-
Rollover Bağlantıları: Bir kullanıcı bir imleci bir bağın üzerine getirdiğinde, bir bağlantı rengi değişir. İlgili HTML etiketi.
-
Aktif Bağlantılar: Bir kullanıcı, etkin bir şekilde bir bağlantıyı tıklattığında, bir bağlantı rengi değişir. İlgili HTML etiketi.
-
-
Altı Çizgisi Stili aşağı açılan listesinden bir stil seçin.
Varsayılan olarak, bir web tarayıcısında görüntülenen bağlantıların altı çizilir. Birçok tasarımcı Asla Altı Değil seçerek bağlantılı metin altında otomatik olarak görünen alt çizgiyi kaldırmayı tercih eder. Ziyaretçilere alt çizginin görsel işaretini verebilirsiniz, ancak yalnızca bir imleci bir bağın üzerine getirirken Devreye Alma seçeneğinde Altı Çizili Göster seçeneğini belirtin.
-
Tamam'ı tıklayın.
Sayfa Özellikleri iletişim kutusu kapanır, stil ayarları sayfadaki tüm bağlantılara otomatik olarak uygulanır ve ilgili stiller CSS Stilleri paneline eklenir.
Bağlantı stillerini tam olarak test etmek için sayfanızı bir web tarayıcısında önizleyin veya çalışma alanının üst kısmındaki Canlı Görünüm düğmesini tıklayın. Önceki egzersizde olduğu gibi değişiklikler yaptığınızda bağlantı ayarlarını bir tarayıcıda test etmek iyi bir uygulamadır. Bağlantlarınızın nasıl göründüğüne bir göz atın.
Örneğin, etkin ve ziyaret edilen bağlantı renklerinin sayfanın arka plan rengine göre iyi olup olmadığını kontrol edin. Sayfa Özellikleri iletişim kutusunu kullanarak oluşturduğunuz stillerin, yeniden tanımlanan etiket stilini geçersiz kılan tek bir bağlantıya farklı bir stil uygulamadığınız sürece sayfanızdaki tüm bağlantılarını etkilediğini unutmayın.
Aynı sayfanın farklı bölümlerinde farklı bağlantı stilleri kullanmak isterseniz, farklı bağlantı stilleri oluşturmak için bileşik stiller oluşturabilirsiniz.
