[HaBo]
| (Web-) Design und webbasierte Sprachen Tipps & Tricks, Designabgleich, HTML & Javascript, Flash, ASP, PHP, Perl/CGI... |
externes CSS einmalig ignorieren
Diskussion: externes CSS einmalig ignorieren im Forum (Web-) Design und webbasierte Sprachen, in der Kategorie Web, Network & Multimedia Palace; Anzeige Tag zusammen, ich habe eine html, die ein externes Stylesheet eingebunden hat. Nun tut es auch was es soll. ...
 |
31.05.10, 21:25
| #1 (permalink) |
| Registriert seit: 01.06.09  Likes: 0 |  externes CSS einmalig ignorieren Anzeige Tag zusammen, ich habe eine html, die ein externes Stylesheet eingebunden hat. Nun tut es auch was es soll. Jetz habe ich jedoch einen Link, bei dem ich das Stylesheet nicht verwenden möchte (d.h. einmaliges ignorieren der CSS datei, danach wieder aktiv). Kennt jemand eine möglichkeit das umzusetzen? Wenn ja, bitte mit Erläuterung, bin noch nicht sehr vertraut mit html...  Wie wäre es an diesem Beispiel: Ausschnitt aus der titel.html: <link rel=stylesheet type="text/css" href="stylesheet.css"> ... <a href="inhalt.html" target="main"> - Home</a> //hier css ignorieren |
|  |
|
31.05.10, 21:47
| #2 (permalink) |
 Registriert seit: 13.02.06  Likes: 1 |  du könntest dem link eine eigene ID geben und dann einfach das styling zurück setzen also: HTML-Code:
css:
a#deineID {
color: #123123;
text-decoration: none;
.
.
.
}
....
...
<a href="blubb.html" id="deineID">Link</a> |
|
| |
| HaBOT | - Anzeige - |
|
|
31.05.10, 22:09
| #3 (permalink) |
| Themenstarter Registriert seit: 01.06.09 Likes: 0 |  Alles klar, danke dir! Funktioniert einwandfrei. Wie könnte ich denn jetz für diese ID z.B. einen Extra-Effekt für A:hover oder A:visited einrichten? Kann das einfach in die {} Klammer von dieser ID mit rein? Bezweifle ich... |
|
| |
|
31.05.10, 23:36
| #4 (permalink) | |
| Member of Honour   Registriert seit: 22.02.07  Likes: 77 | Zitat:
Code: a, a:visited, a:active, a:link {color:#000000;}
a:hover {color:#ff0000;}
a#specialID, a#specialID:visited, a#specialID:active, a#specialID:link {color:#000080;}
a#specialID:hover {color:#0000FF;}
a.specialClass, a.specialClass:visited, a.specialClass:active, a.specialClass:link {color:#000080;}
a.specialClass:hover {color:#0000FF;} Wenn du mehrere Links von deinem Standard abweichend haben möchtest, dann solltest du mit HTML-Code: <a href="#" class="specialClass">blub</a> HTML-Code: <a href="#" id="specialID">blub</a> und solltest du alle Links einer Liste mit ID "navigation" vom Rest der Links abheben wollen, dann schaut das einfach so aus: Code: a, a:visited, a:active, a:link {color:#000000;}
a:hover {color:#ff0000;}
ul#navigation a, ul#navigation a:visited, ul#navigation a:active, ul#navigation a:link {color:#008000;}
ul#navigation a:hover {color:#00ff00;} HTML-Code: <ul id="navigation"> <li><a href="#">foo</a></li> <li><a href="#">bar</a></li> <li><a href="#">blub</a></li> </ul> und willst du da jetzt noch den aktuellen Menüpunkt hervor heben: Code: a, a:visited, a:active, a:link {color:#000000;}
a:hover {color:#ff0000;}
ul#navigation a, ul#navigation a:visited, ul#navigation a:active, ul#navigation a:link {color:#008000;}
ul#navigation a:hover {color:#00ff00;}
ul#navigation li.active a, ul#navigation li.active a:visited, ul#navigation li.active a:active, ul#navigation li.active a:link {color:#000080;}
ul#navigation li.active a:hover {color:#0000ff;} HTML-Code: <ul id="navigation"> <li class="active"><a href="#">foo</a></li> <li><a href="#">bar</a></li> <li><a href="#">blub</a></li> </ul> | |
|
| |
|
01.06.10, 10:38
| #5 (permalink) |
| Themenstarter Registriert seit: 01.06.09 Likes: 0 |  Ok danke für die Tipps! Habs jetz doch über ID gemacht, verwendede den Link zum CSS in verschiedenen html's, da brauch ich wohl kein class...aber werd ich sicher noch brauchen, danke! |
|
| |
|
01.06.10, 11:47
| #6 (permalink) | |
| Member of Honour Registriert seit: 22.02.07 Likes: 77 | Zitat:
Die Verwendung von id="" oder class="" hat überhaupt nichts damit zu tun, in wie vielen Seiten du die CSS verwendest oder so... nochmal ein Beispiel, zur Verdeutlichung: wenn du ein einziges Element hast, welches eindeutig über eine ID identifiziert werden können soll, dann benutzt du id="idName" und im css dann #idName anderenfalls bist du besser dran, du verwendest class="className" und im css dann .className wenn du CSS-Code schreibst, der für ein oder mehrere spezielle Elemente verwendet werden soll - z.B. Links im Footer - AGBs, Impressum und so - , dann möchtest du ja evtl. auch mal mehr als ein Element auf der Seite so aussehen lassen und dann ist folgendes VERBOTEN: HTML-Code: <a href="impressum.html" id="footerlink">Impressum</a> | <a href="agb.html" id="footerlink">AGBs</a> | <a href="datenschutz.html" id="footerlink">Datenschutz</a>  )hier gibst du mehreren HTML-Elementen, einfach weil sie gleich aussehen sollen, die gleiche ID und das darf nicht sein, da eine ID der Identifikation genau eines HTML-Elementes dienen soll - da sollte man dann lieber CSS-Klassen nutzen: HTML-Code: <a href="impressum.html" class="footerlink">Impressum</a> | <a href="agb.html" class="footerlink">AGBs</a> | <a href="datenschutz.html" class="footerlink">Datenschutz</a> Die ID wird z.B. auch dafür benötigt, wenn du über JavaScript zur Laufzeit irgendwelche HTML-Elemente einfügen, bearbeiten, auslesen oder um-positionieren möchtest. Wenn du die ID rein zum Zwecke des Stylings verwendest, kann dir das später mal Probleme bereiten - es geht so schnell, dass du dann versehentlich eine ID nochmal vergibst, weil etwas einfach gleich aussehen soll und dann funktioniert plötzlich ein JavaScript, welches ein bestimmtes HTML-Element manipulieren soll, nicht mehr so, wie es soll... oder du nutzt irgendwelche JavaScripts, welche irgendwelchen HTML-Code erzeugen und die haben dort drin fest codiert schon in irgend 'nem Element 'ne ID drin, die du bei dir auch verwendest und plötzlich setzt du für Elemente dieses Scripts irgendwelche Styles, die gar nichts damit zu tun haben... | |
|
| |
|
01.06.10, 11:54
| #7 (permalink) |
| Themenstarter Registriert seit: 01.06.09 Likes: 0 |  Ja denke das hab ich verstanden. Aber dein Beispiel spielt sich doch ein einem einzigen html ab, oder? Ich habe 2 html's, die beide auf die gleiche ID im css verweisen, das scheint zu gehen. Class brauch ich doch nur, wenn ich 2 Links im selben html hab, die auf die Ausnahme im CSS verweisen sollen...? |
|
| |
|
01.06.10, 11:58
| #8 (permalink) |
| Member of Honour Registriert seit: 22.02.07 Likes: 77 | Ach so meintest du das. Ja, das funktioniert schon. Aber wie gesagt: gewöhn dir nicht zu sehr an, alles mit IDs zu versehen - bei größeren Projekten verlierst du schnell den Überblick und bekommst schneller mal versehentlich 2 gleiche IDs in eine HTML-Seite, als dir lieb ist. IDs solltest du nach Möglichkeit nur da verwenden, wo sie wirklich benötigt werden. Gerade wenn du z.B. dann irgendwelche Seiten dynamisch generierst mit PHP, Ruby oder mit was auch immer... wenn du dort dann vielleicht noch mit einem Template-System arbeitest und nur kleine HTML-Schnipsel baust, dann merkst du dir nicht mehr, wo eine bestimmte ID vielleicht schon einmal vor kam und ob die unter Umständen durch die dynamische Generierung mehrmals in einem generiertem HTML-Dokument vorkommen könnte... |
|
| |
|
01.06.10, 12:03
| #9 (permalink) |
| Themenstarter Registriert seit: 01.06.09 Likes: 0 |  Jawohl, danke für den Rat! Denke ich komm jetz klar. Und bis ich in die Welt von Dynamik & Co eintauche is wohl eh noch weit hin....  |
|
| |
|
01.06.10, 12:11
| #10 (permalink) | |
| Member of Honour Registriert seit: 22.02.07 Likes: 77 | Zitat:
und noch ein Lese-Tipp: für viele Dinge hilft SelfHTML - da solltest du dich echt intensiv durcharbeiten! (damit hab ich mir vor nunmehr über 10 Jahren auch HTML beigebracht und die Inhalte werden auch ständig an aktuelle Neuerungen angepasst - also eigentlich wirklich DAS Nachschlagewerk für HTML...) | |
|
| |
|
| Stichworte |
| css, externes, html, ignorieren, stylesheet |
| - Anzeige - | |
|
|
[HaBo] » Web, Network & Multimedia Palace » (Web-) Design und webbasierte Sprachen » HTML externes CSS einmalig ignorieren
| Themen-Optionen | |
| Ansicht | |
Linear-Darstellung
| |
