css beágyazás

Üdv!

Mint korábban említettem nem vagyok web fejlesztő, ezért kéretik a kérdésnél ezt figyelembe venni! :)

Adva van két css file, az egyikben csak a lap struktúrája van (DIV), a másikban vannak a színek, betűk, stb.
Sajnos - technikai okból - a div-es css-be be kell állítanom egy-két elem háttér színét, de nem akarok két file-t karbantartani módosításkor, ezért szeretnék hivatkozni az első css file-ban a második css file-ban deklarált stílusra. Hogy érthető legyen:

div.css:
.alap .item2 { background: rgb( 230, 230, 230); }

jquery-ui.css:
.ui-widget-header { ...; background: #817865... }

(Mint látható, a jquery-ui -t szeretném használni mint theme, de sajnos az első css-ben nem tudom elkerülni háttérszín megadását)

Tehát az első pédában szereplő background értékét a második pédában szereplő értékre szeretném állítani, úgy hogy a jquery-ui.css -hez nem akarok hozzányúlni.

Ötlet?

Tilla

Hozzászólások

Nem vagyok én sem html expert, de a feldolgozás sorrendjén is múlik, hogy a böngészöben mi jelenik meg ha mindkét stíluslapot használod és esetleg vannak átfedések bár ha jól veszem ki akkor erről itt nincsen szó - itt lenne érdekes, hogy a technikai okok mit takarnak. Ha megoldható akkor a jquery cssét linkeld be a html headerbe és akkor csak azt kell karbantartani.

A html headerben meg kell cserélni a 2 css-t. Így a másodjára belinkelt saját css-ben felül lehet definiálni a jqueryui css osztályait.

Vagy segíthet az !important is:

div.css:
.alap .item2 { background: rgb( 230, 230, 230) !important; }

jquery-ui.css:
.ui-widget-header { ...; background: #817865... }

Mindig rosszul kérdezek...

A feladat az, hogy a div.css -be NE kelljen konkrét háttérszínt megadni, hanem hivatkozzon a jquery.css-re:
MINTA (ez nem működik!)

div.css
<.alap .item2 { .ui-widget-header }/code>

Tehát először betöltöm a jquery.css-t, majd a div.css-t.

Tilla

Üdv!

Azért, mert nincs kedvem minden "thema" változtatásnál minden elemet újra átnézni. A Jquery-UI -hoz van a neten egy jó szerkesztő. Itt végig lehet szerkeszteni minden részletet. A "másik" css adja az egész weblap struktúráját, menü kezelőjét, stb.

Ha "másik" css-be tudok hivatkozni a thema css-re, akkor csak a thema css-t kell lecserélnem, javítanom, szerkesztenem, stb. a "másik" css átveszi az új beállításokat.

Tilla

.alap .item2 { .ui-widget-header }

Ilyen még nem létezik. A css az nem programnyelv. Amúgy fölösleges deklarálni az .alap.item2 -t ha az .ui-widget-header ugyanazt a formázást jelenti.

Szerintem egyszerűen tedd be a html markup-ba az .item2 mellé azt hogy .ui-widget-header,
ha mindenképp bonyolítani akarod akkor használj javascriptet és valami ilyesmit :

http://pastebin.com/gTxTV4sj

Üdv!

Amit írsz, hogy nem létezik, tudom, az csak példa lett volna. Innentől számomra látható, hogy ez az út nem járható.

Mindenesetre némi huszárvágással megoldottam a dolgot, átírtam a menü rendszert jquery alapjaira, így már tudom használni a jquery-ui -t is.

A probléma gyökere ott volt, hogy ebben a webes rendszerben a ddmx menü megoldás volt, e mellé került volna bele a jquery-ui. Ezt a kettőt kellett volna úgy összedolgoznom, hogy színeket, betűket, stb. (formázást) kizárólag a jquery-ui hordozza. Így egy sima thema selectorral váltható az egész rendszer témája.

Mindenesetre megígérem nem kontárkodok ebbe az egész webes programozásba. :)
Ez az egy rendszer az, amit immár 5-6 éve használok, fejlesztek, üzemeltetek és ehhez kellett a fenti megoldás.

Tilla