Window>>CSS Styles menüsünü ya da Launch Bar'da yer alan CSS düğmesini tıklayarak CSS Styles paneline ulaşırız.
CSS panelinin iki farklı görünümü vardır. Birincisi "Apply Styles" seçenek düğmesi seçili olduğundaki görünümüdür. Bu görünüm stil uygulamak için kullanılan görünümdür. Bu görünümde Styles List bölümünde mevcut stiller alt alta sıralanmış haldedirler. Mevcut bir stili uygulamak için stil uygulanacak metin, tablo, katman vs. elemanı seçtikten sonra bu listedeki uygulamak istediğimiz stilin adına 1 kez tıklamamız yeterli olacaktır.
Apply Styles görünümünde panelin sağ altında 2 düğme yer alır. Bunlardan ilki Attach Style Sheet (
) düğmesidir. Bu düğme ile bir stil dosyasını sayfamıza bağlayabiliriz.
Diğer düğme ise New CSS Style (
) düğmesidir. Bu düğme ile yeni bir stil sayfası oluşturabiliriz.
Panelin üst kısmındaki "Edit Styles" seçenek düğmesine tıkladığımızda Edit Styles görünümüne geçiş yaparız.
Bu görünüm stillerimiz üzerinde değişiklik yapmak içindir. Sayfaya bağlı bir stil sayfasının adını seçerek ya da bu sayfa içerisindeki bir stili(Stil sınıfı, Bağ imi sınıfımsıları vs.) seçerek düzenlememize yarar.
Bir stili düzenlemek için stili faremizle seçili hale getirip Edit Style Sheet... (
) düğmesine tıklamalıyız.
Bir stil sayfasının tümden silmek ya da içerisindeki bir stili silmek için yine bu pencerede stili seçip Delete CSS Style (
) düğmesine tıklamak gerekir.
Bir stili düzenlemek için Edit Styles görünümünü kullanmak gerekir.
Apply Styles görünümünde bir stil adı üzerine bir kez tıklamnız o stili uygulamanızı sağlayacağı için seçtiğiniz elemana dikkat etmeniz gerekir.
Örneğin bir metnenin belirli bir bölümüne stil uygulamak istiyorsanız metnin o bölümün seçmiş olmalısınız eğer fazlalık bir bölümüde seçili hale getirmişseniz stil orayada uygulanacaktır.
İmlecinizle rastgele bir tablo hücresine tıkladıktan sonra herhangi bir stil adına tıklarsanız o stil o hücredeki tüm içeriğe uygulanacaktır.
Uyguladığınız stilleri geri almak için History panelini ya da Edit>>Undo menüsünü kullanabilirsiniz.
Bu derste sadece CSS Styles Paneli tanıttık. Yeni bir stilin nasıl oluşturulacağını, bir stilin nasıl düzenleneceğini, bir HTML sayfası ile bir stil sayfası arasında nasıl ilişki kurulacağını ayrıntılı olarak daha sonraki derslerde anlatacağız.
CSS panelinin iki farklı görünümü vardır. Birincisi "Apply Styles" seçenek düğmesi seçili olduğundaki görünümüdür. Bu görünüm stil uygulamak için kullanılan görünümdür. Bu görünümde Styles List bölümünde mevcut stiller alt alta sıralanmış haldedirler. Mevcut bir stili uygulamak için stil uygulanacak metin, tablo, katman vs. elemanı seçtikten sonra bu listedeki uygulamak istediğimiz stilin adına 1 kez tıklamamız yeterli olacaktır.
Apply Styles görünümünde panelin sağ altında 2 düğme yer alır. Bunlardan ilki Attach Style Sheet (
Diğer düğme ise New CSS Style (
Panelin üst kısmındaki "Edit Styles" seçenek düğmesine tıkladığımızda Edit Styles görünümüne geçiş yaparız.
Bu görünüm stillerimiz üzerinde değişiklik yapmak içindir. Sayfaya bağlı bir stil sayfasının adını seçerek ya da bu sayfa içerisindeki bir stili(Stil sınıfı, Bağ imi sınıfımsıları vs.) seçerek düzenlememize yarar.
Bir stili düzenlemek için stili faremizle seçili hale getirip Edit Style Sheet... (
Bir stil sayfasının tümden silmek ya da içerisindeki bir stili silmek için yine bu pencerede stili seçip Delete CSS Style (
Bir stili düzenlemek için Edit Styles görünümünü kullanmak gerekir.
Apply Styles görünümünde bir stil adı üzerine bir kez tıklamnız o stili uygulamanızı sağlayacağı için seçtiğiniz elemana dikkat etmeniz gerekir.
Örneğin bir metnenin belirli bir bölümüne stil uygulamak istiyorsanız metnin o bölümün seçmiş olmalısınız eğer fazlalık bir bölümüde seçili hale getirmişseniz stil orayada uygulanacaktır.
İmlecinizle rastgele bir tablo hücresine tıkladıktan sonra herhangi bir stil adına tıklarsanız o stil o hücredeki tüm içeriğe uygulanacaktır.
Uyguladığınız stilleri geri almak için History panelini ya da Edit>>Undo menüsünü kullanabilirsiniz.
Bu derste sadece CSS Styles Paneli tanıttık. Yeni bir stilin nasıl oluşturulacağını, bir stilin nasıl düzenleneceğini, bir HTML sayfası ile bir stil sayfası arasında nasıl ilişki kurulacağını ayrıntılı olarak daha sonraki derslerde anlatacağız.