zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Elementeigenschaft nur bei bestimmten Div

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 11.05.2017, 09:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.01.2017
Beiträge: 26
crane befindet sich auf einem aufstrebenden Ast
Standard Elementeigenschaft nur bei bestimmten Div

Hallo,
ich habe zu folgenden Problem eine Frage. Ich habe z.B. Elemente wie Links die eine bestimmte Eigenschaft zu gewiesen bekommen sollen. Diese besondere Eigenschaft soll aber auf das Element nur in einem bestimmten div verwendet werden.
Was für Möglichkeiten habe ich das mit CSS-File und HTML-File zu deklarieren.
Mit einem Code-Beispiel wäre mir dabei sehr geholfen.

Vielen Dank
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 11.05.2017, 09:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.074
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Dafür ist CSS und HTML gemacht worden, sind sozusagen die Grundlagen davon.
Code:
.link{
color: white
}

.link2{
color: green;
}
Wo hast du denn konkrete Schwierigkeiten?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 11.05.2017, 11:01
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 03.01.2017
Beiträge: 26
crane befindet sich auf einem aufstrebenden Ast
Standard

Also ich habe folgenden HTML Code:
Code:
<div id="header">
<img class="logo" src="https://xhtmlforum.de/../bilder/logo.png"></img>
<a href="news.htm">News</a>
<a href="info.htm">Über Mich</a>
<a href="craniosacral.htm">Craniosacral</a>
<a href="links.htm">Links</a>
<a href="kontakt.htm">Kontakt</a>
</div>
Nun sollen nur die Links also a tags in diesem div eine bestimmte Eigenschaft bekommen.

Im CSS-File habe ich den Header folgender Maßen deklariert:
Code:
#header {
  position:absolute; 
  top:0px; 
  left:0px; 
  width:100%; 
  height:115px; 
  overflow:hidden; 
  background:#53829d;
}
Wie kann ich das ohne großen Aufwand machen.

Dann bräuchte ich noch eine andere Hilfe zu zwei Dingen:
Erstens lade ich in dem HTML code ein Bild. Da ich aber noch eine mobile Version der Website gestallten möchte, habe ich das selbe Bild in kleinerer größe vorliegen. Wie kann ich das Bild dem entsprechend ersetzen lassen, d.h. nur das gewünschte Bild wird geladen.

Und als letztes brauche ich in dem Header bei der mobilen Version noch ein weiteres Bild, da ich die Links bei der mobilen Version in einem Drop-down Menü, wo der dazugehörige Button ein Bild ist unterbringen möchte. Ich habe schon alles was ich brauche. Nur muss ich noch wissen wie es fertig bringe das die entsprechenden Dinge nur abhängig vom Media Query genutzt/angezeigt werden.
Mit Zitat antworten
  #4 (permalink)  
Alt 11.05.2017, 11:50
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard

Wenn du Links formatieren möchtest, kann man das z.B. so machen:

HTML-Code:
a {
   color: red;
}
Das würde sich allerdings auf ALLE Links auswirken. Möchtest du wiederum nur die Links in einem bestimmten Bereich/div stylen, z.b. innerhalb von <div id="header">, dann so:

HTML-Code:
#header a {
   color: red;
}
Solange in deinem Fall nichts dagegen spricht, sind Klassen aber mehr als IDs zu empfehlen. Also <div class="header-main"> oder ähnlich.

Noch moderner wäre es, HTML5- Elemente zu verwenden:

HTML-Code:
<header>
   ...
</header>
Außerdem solltest du für deine Navigation nicht nur reine Links, sondern auch eine Liste verwenden:

HTML-Code:
<header>
   <ul>
      <li><a href="seite-1.html">Seite 1</a></li>
      <li><a href="seite-2.html">Seite 2</a></li>
      <li><a href="seite-3.html">Seite 3</a></li>
   </ul>
</header>
Und in HTML5 verwendet man außerdem das <nav>-Element dazu:

HTML-Code:
<header>
   <nav>
      <ul>
         <li><a href="seite-1.html">Seite 1</a></li>
         <li><a href="seite-2.html">Seite 2</a></li>
         <li><a href="seite-3.html">Seite 3</a></li>
      </ul>
   </nav>
</header>
Mit Zitat antworten
Antwort

Stichwörter
div, eigenschaft, element

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:42 Uhr.