Zmienne (w) CSS - Forum PHP.pl

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

Zmienne (w) CSS, Unikalne wykorzystanie CSS

Tomplus Zobacz profil	6.08.2008, 16:16:15 Post #1
Grupa: Zarejestrowani Postów: 1 884 Pomógł: 231 Dołączył: 20.03.2005 Skąd: Będzin Ostrzeżenie: (0%)	Witam, Myślę, że uda się mi się tutaj znaleźć pomoc i może ktoś inny również z korzysta z tego :) Ostatnio zacząłem korzystać z nie których rzadkich attrybutów styli CSS np. content podczas Zrobiłem sobie taką stronę testową: http://www.swos.pl/temp/css/testcss.html a poniżej kod całej strony [skrócony o przykładowe texty i tagi]: [HTML] pobierz, plaintext <html> <head> <title>Test CSS</title> <style type="text/css"> body { background: url(t.gif); } .note, .note-title, .note-news { background: transparent; border: 1px solid #DDD; color: #999; font-size: .9em; padding: 2px 4px 2px 34px; } .note { background: url(' ' attr(src) ' ') no-repeat 8px 50%; } .note-title { background: url(k.png) no-repeat 8px 50%; color: #66B; } .note-news { padding: 2px 4px 2px 4px; } .note:before { background: transparent; color: #9995DD; content: ' ' attr(title) ' '; color: ' ' attr(color) ' '; background-image: url(' ' attr(src) ' '); border-color: ' ' attr(color) ' '; font-weight: bold; } p.note-news:before { background: transparent; color: #a96; content: 'NEWS: '; font-weight: bold; } p.note-title:before { background: transparent; color: #369; content: 'Tytuł: '; font-weight: bold; } .note:hover, .note-title:hover { border: 1px solid #999500; color: #666; } .note-news:hover { border: 1px solid #666; color: #666; } </style> </head> <body> <p class="note-title">O Łagiszy</p> <p class="note" title="Łagisza">W 1969 roku w wielu gazetach pisano o Łagiszy.</p> <p class="note-news">Z dniem pierwszego stycznia 1969 r, utraciłem definitywnie swoje wiejskie pochodzenie. Moja rodzinna wieś Łagisza w powiecie będzińskim.</p> <p class="note" title="Notka" src="quote.gif">W 1969 roku w wielu gazetach pisano o Łagiszy. </p> </body> </html> [HTML] pobierz, plaintext Prosiłbym o skupienie się nad takimi miejscami jak title w tagach <p> Dzięki tej własności wyświetla się tytuł odrazu na stronie, jako TEXT któru nie daje się skopiować jak zwykły text czy obrazek. Jest wygodne bo gdy user chce skopiować jakiś text, nie musi zaprzątać sobie głowy nie którymi "śmieciami". Jednak ja chciałbym tą wygodę sobie rozszerzyć o inne elementy np. grafikę i kolory. Szczególnie to pierwsze. Nie chce tworzyć kolejnych wpisów jak przy klasa .note-news i .note-title, ale tak że za każdym razem gdy będzie tego potrzeba będę mógł zmienić grafikę/małą ikonkę przy wpisie. Dlatego pytam się jak zrobić aby jakaś nowa grafika/kolor mógł się wyświetlić tak jak tytuł fragmentu textu czyli przy pomocy takich atrybutów jak ' ' attr(title) ' ', gdyż zastosowanieczegoś podobnego attr(src) nie działa? Ten post edytował Tomplus 6.08.2008, 16:17:07