Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 15 von 16

Thema: CSS: Mehrere Linkeigenschaften

  1. #1
    TP-Supporter Avatar von Zoppix
    Registriert seit
    Feb 2002
    Ort
    Blenheim (South Isl.)
    Beiträge
    349

    Question CSS: Mehrere Linkeigenschaften

    Hallo Leute!

    Ich habe mal eine Frage zum Thema CSS.
    Man kann ja in einer CSS Datei verschiedene Texteigenschaften speichern. Z.b. "text" , "text_groß" und so weiter und denen kann man dann die jeweiligen Eigenschaften zuweisen, ob sie fett oder klein angezeigt werden sollen.

    Sowas kann man doch bestimmt auch mit den Links machen die man hat! Nur wie erstelle ich verschiedene Eigenschaften die ich dann den Links zuweisen kann? Könnt euch ja mal die Grafik angucken. Ich hoffe ihr habt mein Problem verstanden!

    Danke!
    Angehängte Grafiken Angehängte Grafiken  

  2. #2
    TP-Insider Avatar von Jupp
    Registriert seit
    Jul 2004
    Ort
    Mönchengladbach
    Beiträge
    771
    a{css-code} trifft auf alle <a> tags zu. hier kannst du angaben wie font-family usw. notieren, um links zu formatieren. es gibt noch weitere eigenschaften, z.b. a:hover{} (link mit maus drüber). schau doch mal hier nach: http://de.selfhtml.org/navigation/cs...ntrale_formate

  3. #3
    TP-Supporter Avatar von Zoppix
    Registriert seit
    Feb 2002
    Ort
    Blenheim (South Isl.)
    Beiträge
    349
    Heißt das, dass ich unter dem Begriff "a" diese linkeigenschaften speichern kann?
    Also dann zum Beispiel unter "b" das nächste Linkaussehen und unter "c" und so weiter...


    //NACHTRAG//

    Mir geht es einfach nur darum, dass ich nicht immer nur Links habe die ALLE gleich aussehen. Ich will auch welche haben, die mal größer mal kleiner sind, oder andere Farben haben! Nur ich weiß nicht, wie ich das mache das ich dann zwischen diesen verschieden Eigenschaften auswählen kann.
    Geändert von Zoppix (25.10.2004 um 18:17 Uhr)

  4. #4
    TP-Insider Avatar von Jupp
    Registriert seit
    Jul 2004
    Ort
    Mönchengladbach
    Beiträge
    771
    das geht so z.b.:

    HTML-Code:
    a.mail{}
    a.mail:hover{}
    a.mail:active{}
    usw...

    und dann
    HTML-Code:
    <a href="#" class="mail">Link</a>
    zur erläuterung: das "a" deutet an, dass sich die css-definiton nur auf das html-element "a" bezieht (d.h. also nur auf verweise). danach kannst du dir einen namen aussuchen (im beispiel "mail"). mit 'class="name"' weist du dann dem jeweiligen link diese klasse zu.
    Geändert von Jupp (25.10.2004 um 18:34 Uhr)

  5. #5
    TP-Special Mod Avatar von webmichl
    Registriert seit
    Jun 2001
    Ort
    8°21' O 49°1' N
    Beiträge
    8.676
    Die Standarddefinition ist - wie Jupp richtig sagt - a { eigenschaften }. Diese kann dann noch unterschieden werden in a:visited ( schon besucht ), a:hover ( beim Mausdrüberfahren ) und a:active ( gerader aktiver Link - den Effekt kriegt man aber äusserst selten mit ).

    Wenn das nicht langt: Du kannst auch für Links unterschiedliche Klassen definieren. Das sieht dann zB so aus:

    a.ganzwichtig { color: red; }

    Und auch hier wirken die Eigenschaftsdefinitionen:
    a.ganzwichtig:hover { font-weight: bold }

    Angesprochen wirds wie jede andere CSS-Klasse:

    <a href="kaufen.htm" class="ganzwichtig">Kaufen!</a>
    Gruß, der Michl


    * * * if you want them to RTFM, make a better FM! * * *

  6. #6
    TP-Supporter Avatar von Zoppix
    Registriert seit
    Feb 2002
    Ort
    Blenheim (South Isl.)
    Beiträge
    349
    Nach langem Hin und Her hab ich es geschafft!!!
    Das ist jetzt sogar genau so, wie ich es mir vorgestellt habe!

    Wenn mir jetzt noch einer sagt, wie ich den Thread als "Erledigt" kennzeichnen kann, bin ich für heute wunschlos glücklich! (Beim alten Forum war das einfacher...)
    Geändert von Zoppix (25.10.2004 um 19:14 Uhr)

  7. #7
    TP-Junior Avatar von DarkLord
    Registriert seit
    Oct 2004
    Ort
    Helmstedt
    Beiträge
    8

    Hab dazu auch mal eine Frage!

    Tach auch!

    Da habe ich auch mal eijne Frage:

    Mit Hover ist das Ja kein Problem,
    aber ich habe bei meinem Breufs-Praktikum erfahren
    dass mall auch Links machen kann mit zB. Blauem
    Text, und gelber Linie drunter! Da frage ich ihn wie,
    und er sagt: "Mit den Division Tags"

    Also habe ich gesucht und gesucht, aber ich habe
    echt nichts gefunden!

    Ob Ihr mir dabei helfen könntet?

    Bis Denne

    E-Lord

  8. #8
    TP-Special Mod Avatar von webmichl
    Registriert seit
    Jun 2001
    Ort
    8°21' O 49°1' N
    Beiträge
    8.676
    Falls "er" damit <DIV>-Container meint, kannst Du ihm sagen, daß es auch einfacher geht:

    Code:
    <style type="text/css">
       <!-- 
       a { color: blue; text-decoration: none; }
       a:hover { border-bottom: 1px solid yellow; } 
       -->
       </style>

    EDIT
    Seh gerade, daß Du den Effekt dauernd haben willst (?) - dann nimm die border-Anweisung mit in die normale Definition und werf die hover-Klasse wech...
    Gruß, der Michl


    * * * if you want them to RTFM, make a better FM! * * *

  9. #9
    TP-Supporter Avatar von Zoppix
    Registriert seit
    Feb 2002
    Ort
    Blenheim (South Isl.)
    Beiträge
    349
    Ist echt schön was man mit CSS zaubern kann. Und alles auf Textbasis, echt geil!
    Aber wie markiere ich jetzt einen Thread als Erledigt! Früher ging das doch auch!

  10. #10
    TP-Special Mod Avatar von webmichl
    Registriert seit
    Jun 2001
    Ort
    8°21' O 49°1' N
    Beiträge
    8.676
    schreib "erledigt" drunter....
    Gruß, der Michl


    * * * if you want them to RTFM, make a better FM! * * *

  11. #11
    TP-Member Avatar von Dust
    Registriert seit
    Oct 2004
    Ort
    Köln
    Beiträge
    86
    "Mit den Division Tags"
    meinet er
    a {/*eigenschaften ohen efekt*/}

    /*mouse over efekt*/

    a:hover {
    color:#0000ff;
    border-bottom:1px yellow solid;
    }

    wenn du dann das z.B div etwa 150 px breit ist, dann musst du dem a:hover ein disply:block; mitgeben damit sich diese efekt im ganzen div breitmacht und nicht nur die schrift hervorgehoben wird... (genauso wenn die schrift 12 px gross ist aber das darüberlinegene element z.b 25px hoch ist)

    besser nachzu lesen unter den psoydo elementen in selfhtml...
    GIT(in education) dx s--:+ a-- C++ UL+++ P+ L++ E-- W+++ N* o+ K- w-- O- M- V- PS++ PE++ Y PGP- t++ 5- X++ R+ tv+ b++ DI-- D G+++ e h- r- x+

    interested in some fun?

  12. #12
    TP-Junior Avatar von DarkLord
    Registriert seit
    Oct 2004
    Ort
    Helmstedt
    Beiträge
    8

    Lightbulb Cool

    Cool, danke!

    Aber da habe ich dann noch eine Frage:

    Ich habe mal auf einer Homepage gesehen, welche ich jetzt
    auch nicht mehr weiß, dass eine Person in einem Division Tag
    welcher glaube so ca. 200px breit war ein Menu mit Links gehabt,
    welche beim Mouseover eine Hintergrundfarbe hatten, welche
    sich vom anfang des Div's bis zum ende durchgezogen haben!
    Also ein Background-color:... aber dass der Hintergrund über den
    Link hinaus ging!

    Bis Denne

    DarkLord

  13. #13
    TP-Member Avatar von Dust
    Registriert seit
    Oct 2004
    Ort
    Köln
    Beiträge
    86
    ich kann mir vorstellen wenn es genau 2px drüber steht dann liegt das vieleicht an dem borde (siehe unten)...
    wenn es mehr sind dann kann es sein das dem drunterliegendem element einfach eine grössere pix zahl gegeben wurde...
    aber ehlich gesagt kein schöner efekt...

    oder meinst das sich der efekt über das ganze element aus gebreitet hatte, dann brauchst du nur display:block; in die a class zu tun...

    <div class="a">
    <a href="#" class="b">bla</a>
    </div>

    div.a{
    width:200px;
    height:25px;
    backgroung-color:#aaaaaa;

    }

    a:hover.b{
    width:25px;
    height:200px;
    border:1px #solid #00ff00;
    background-color:#123456;
    }
    Geändert von Dust (27.10.2004 um 12:31 Uhr)
    GIT(in education) dx s--:+ a-- C++ UL+++ P+ L++ E-- W+++ N* o+ K- w-- O- M- V- PS++ PE++ Y PGP- t++ 5- X++ R+ tv+ b++ DI-- D G+++ e h- r- x+

    interested in some fun?

  14. #14
    Guest Avatar von Pulli
    Registriert seit
    Sep 2004
    Beiträge
    125
    Zitat Zitat von Zoppix
    Heißt das, dass ich unter dem Begriff "a" diese linkeigenschaften speichern kann?
    Also dann zum Beispiel unter "b" das nächste Linkaussehen und unter "c" und so weiter...
    Nein, das a steht für die allgemeine Definition "a href...". Da packst du rein was bei Links immer gleich ist. Wenn das nicht zutrifft dann machst du es eben speziell.

  15. #15
    TP-Member Avatar von Dust
    Registriert seit
    Oct 2004
    Ort
    Köln
    Beiträge
    86
    aber die bedeutung des punktes und lehrzeichen ist klar ?
    GIT(in education) dx s--:+ a-- C++ UL+++ P+ L++ E-- W+++ N* o+ K- w-- O- M- V- PS++ PE++ Y PGP- t++ 5- X++ R+ tv+ b++ DI-- D G+++ e h- r- x+

    interested in some fun?

Seite 1 von 2 12 LetzteLetzte

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Ähnliche Themen

  1. css und mehrere Tabellen!
    Von skymen im Forum Dreamweaver & andere Webeditoren
    Antworten: 1
    Letzter Beitrag: 17.01.2004, 22:52
  2. CSS auf mehrere Dokumente&Frames anwenden
    Von Alirion im Forum Dreamweaver & andere Webeditoren
    Antworten: 2
    Letzter Beitrag: 01.08.2003, 17:05
  3. [CSS] CSS - mehrere links integrieren
    Von nicnac1 im Forum HTML & CSS
    Antworten: 6
    Letzter Beitrag: 25.10.2001, 12:50

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

     

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •  

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51