Stílusok létrehozása osztály- és azonosítóválasztókkal a Dreamweaverben

A Dreamweaver osztály- és azonosítóválasztóinak sok hasonlósága van, és egy lényeges különbség van. Az azonosítóstílusok oldalanként csak egyszer használhatók, de az osztálystílusok annyiszor használhatók ugyanazon az oldalon, ahányszor csak akarja.

Az osztály- és azonosítóstílusok a következő hasonlóságokkal rendelkeznek:

Bármit elnevezhet az osztály- és azonosítóválasztókkal létrehozott stílusoknak. Ne használjon szóközt vagy speciális karaktereket a stílusnevekben, bár az aláhúzás és a kötőjel megfelelő. A kisbetűk használata általános, de nem kötelező gyakorlat.

Az osztály- és azonosítóstílusokat az oldal bármely elemére alkalmazhatja, de leggyakrabban fejléccímkékre, div címkékre, rendezetlen listacímkékre, bekezdéscímkékre, képcímkékre és az új HTML5 címkékre alkalmazzák.

Az osztály- és azonosítóválasztóval létrehozott stílusok használata kétlépéses folyamat. Először hozzon létre egy új stílust az osztály vagy az azonosító választó segítségével, és adjon neki nevet; majd alkalmazza a stílust az oldal egy elemére.

Új osztály vagy azonosító stílus meghatározásához hozzon létre és mentsen el egy új dokumentumot, vagy nyisson meg egy meglévő fájlt, majd kövesse az alábbi lépéseket:

1Ha egy meglévő elemre alkalmazni kívánt új stílust határoz meg, kattintson a gombra, és vigye a kurzort arra az elemre, amelyet az új stílussal formázni szeretne.

Bár ez a lépés nem kötelező (stílusokat hozhat létre olyan elemekhez, amelyek még nem szerepelnek az oldalon), a Dreamweaver automatikusan létrehozza a választóneveket a kurzor által éppen kijelölt oldalelem alapján.

2A CSS Designer panel Selectors paneljén válassza ki annak a stíluslapnak a nevét, amelyhez hozzá szeretné adni az új stílust.

Ha a stílust egy adott médiatípusra vagy képernyőméretre szeretné megcélozni, határozzon meg egy médialekérdezést a @Media panelen.

Ha nem ad meg médialekérdezést, a Dreamweaver a Global tulajdonságot fogja használni, és az Ön stílusa minden médiaformátumban és képernyőméretben működni fog.

3 A Kijelölők panelen kattintson a pluszjelre (+).

Egy új választó kerül hozzáadásra a Kiválasztó panelhez. A Dreamweaver hozzáadott egy összetett választónevet, amely tartalmazza az összes olyan stílust, amelyet már alkalmaztak a címsorhoz, ahol a kurzor állt, amikor elkezdte meghatározni a stílust.

4Kattintson duplán a választó nevére, és szerkessze vagy cserélje ki a stílusához használni kívánt névre.

Bármit elnevezhet az osztály- és azonosítóstílusoknak, feltéve, hogy nem használ szóközt vagy speciális karaktert a kötőjelen (-) vagy az aláhúzáson (_) kívül.

Ha stílust szeretne létrehozni az osztályválasztóval, akkor a stílus nevét ponttal vagy ponttal kell kezdenie. Ha az azonosító választót szeretné használni, a stílus nevének fontjellel (#) kell kezdődnie.

5 A Tulajdonságok panelen adja meg a stílusszabály beállításait.

Az osztály- és azonosítókiválasztók könnyen alkalmazhatók a tartalomra, miután létrehozta őket, mivel a Dreamweaver hozzáadja ezeket a stílusokat a munkaterület alján található Property Inspector Osztály és azonosító legördülő listáihoz.