Seite 1 von 1

[gelöst]Link im Header, farben und Schrift ändern

Verfasst: 13.02.2008 00:15
von BoZA
Hi ich hoffe ihr könnt mir helfen!?

Ich habe im Header ein Link eingebaut. Leider weiß ich nicht, wie ich den farblich ändern kann bzw. auch die Schriftart festlegen kann, sowie die Position kann ich nur nach unten bestimmen.

overall_header.html

Code: Alles auswählen

<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>

			<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
				<!--<h1>{SITENAME}</h1>-->
				<!--<p>{SITE_DESCRIPTION}</p>-->
			  <p style="display: none;"><a href="#start_here">{L_SKIP}</a></p>
			</div>

		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<div id="search-box">
			  <form action="{U_SEARCH}" method="post" id="search">
				<fieldset>
					<input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" /> 
					<input class="button2" value="{L_SEARCH}" type="submit" /><br />
					<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
				</fieldset>
				</form>
			</div>
            <!-- Der Gallery Link -->
            <div id="Gallery-box">
              <a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}">{L_GALLERY}</a>
            </div>
		<!-- ENDIF -->
common.css

Code: Alles auswählen

#Gallery-box {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #828282;
	/*font-size: 62.5%;			 This sets the default font size to be equivalent to 10px */
	font-size: 10px;
	color: #FFFFFF;
	margin-top: 60px;
	
}
Hier ein kleines Bild des Headers
[ externes Bild ]


Danke für Eure Hilfe im Voraus!!!

Verfasst: 13.02.2008 14:07
von Shuichi
Es geht hier drum?

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}">{L_GALLERY}</a> 
Ich denke du musst es so machen:

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}" class="muster">{L_GALLERY}</a> 
Also eine class für diesen Link definieren; entweder benutzt du eine bestehende aus der CSS oder erstellst gegebenenfalls eine neue.

Verfasst: 13.02.2008 17:07
von BoZA
Shuichi hat geschrieben:Es geht hier drum?

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}">{L_GALLERY}</a> 
Ich denke du musst es so machen:

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}" class="muster">{L_GALLERY}</a> 
Also eine class für diesen Link definieren; entweder benutzt du eine bestehende aus der CSS oder erstellst gegebenenfalls eine neue.
Ah cool, genau das meine ich!!

Und wie kann ich sie in der common.css ansprechen??

Code: Alles auswählen

.muster {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	color: #828282;
	/*font-size: 62.5%;			 This sets the default font size to be equivalent to 10px */
	font-size: 20px;
	color: #FFFFFF;
}
edit:/ Super das Klappt, jedoch kann ich die Position nicht verändern, sowie die Schriftfarbe! Muss ich das evtl. in einer anderen CSS Datei machen`?

Verfasst: 15.02.2008 00:28
von BoZA
Ich erneuer mal mneine Frage!

Ich habe nun geschafft den Link zu setzen. Allerdings wie o. beschrieben konnte ich weder Farbe noch Schriftart sowie Position verändern.

Nun habe ich mich entschieden den Link einfach durch ein Bild zu ersetzen!!
Also ein weiteres Bild in der Headerbar bestimmen...

Wie tu ich dies nun. Habe versucht in der Online Doku von phpbb3 mich schlau zu lesen doch leider ohne erfolg.

der Links zu der seite ist "klick mich"

Danke euch für eure Hilfe im Voraus.

MfG Bo

Verfasst: 15.02.2008 00:33
von Shuichi
Was die Farbe angeht:

Code: Alles auswählen

.muster {
   font-family: Verdana, Helvetica, Arial, sans-serif;
   color: #828282;
   /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
   font-size: 20px;
   color: #FFFFFF;
}
Das ist dein Code - wenn du genau hinsiehst hast du zweimal "color" definiert und er nimmt logischerweise die untere Bezeichnung; also es bleibt immer weiß, egal, wie du die obere Definierung änderst. Also änder es in:

Code: Alles auswählen

.muster {
   font-family: Verdana, Helvetica, Arial, sans-serif;
   color: #828282;
   /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
   font-size: 20px;
}
Dann geht das schonmal.

Was die Position angeht: Wie bzw. wo genau willst du es denn positionieren? Was stellst du dir da vor?

Verfasst: 15.02.2008 11:40
von BoZA
Shuichi hat geschrieben:
Dann geht das schonmal.

Was die Position angeht: Wie bzw. wo genau willst du es denn positionieren? Was stellst du dir da vor?
Naja, sagen wir mal so. Ich habe mich jetzt dazu entschieden für den Link ein Bild einzufügen, aber auch da stoss ich auf meine Unkentnis bzgl XHTML und CSS.

overall_header.html

Code: Alles auswählen

<div id="Gallery-box">
              <a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN} class="gallery">{GALLERY_IMG}</a>
            </div>
common.css

Code: Alles auswählen

.gallery {
	background-image: url("{T_THEME_PATH}/imageset/gallery.png");
	float: right;
	width: auto;
	padding: 10px 13px 0 10px;
}

/*und*/

#Gallery-box {
	background-image: url("{T_THEME_PATH}/imageset/gallery.png");
	float: right;
	width: auto;
	padding: 10px 13px 0 10px;
}
Ich packe[/quote] es einfach nicht...

Verfasst: 15.02.2008 13:32
von Dr.Death
Du hast noch einen SYNTAX Error:

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN} class="gallery">{GALLERY_IMG}</a>
Sollte eher:

Code: Alles auswählen

<a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}" class="gallery">{GALLERY_IMG}</a>
heissen.

Und unter:

http://www.steinhaus-berlin.de/Forum/st ... allery.png

existiert kein Bild...daher kann es auch nicht angezeigt werden.

Verfasst: 15.02.2008 14:37
von BoZA
Ah super!

Tausen Dank das Bild ist jetzt richtig Positioniert!

Nur ich hab noch ein Problem!
Ich bekomme das Bild nich verlinkt!

overall_header.html

Code: Alles auswählen

 <div id="Gallery-box">
              <a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}" class="gallery">{GALLERY_IMG}</a>
            </div>
common.css

Code: Alles auswählen

.gallery {
  /*Muss ich hier evtl noch was reinschrieben um das Bild
  	richtig zu verlinken? */
}

#Gallery-box {
	background: no-repeat;
	background-image: url("{T_THEME_PATH}/images/gallery.png");
	width: auto;
	height: 25px;
	margin-top: 60px;
	margin-left: 530px;
}
Danke Dr.Death! Den Syntax Error hätte ich niemals entdeckt!

Verfasst: 15.02.2008 15:48
von Shuichi
Dein Bild ist ein Backgroundbild - diese kann man, meines Wissens, nicht verlinken.

Du müsstest das Bild via <img src=""> definieren und bei

Code: Alles auswählen

{GALLERY_IMG}
einfügen.

Verfasst: 15.02.2008 16:07
von BoZA
Shuichi hat geschrieben:Dein Bild ist ein Backgroundbild - diese kann man, meines Wissens, nicht verlinken.

Du müsstest das Bild via <img src=""> definieren und bei

Code: Alles auswählen

{GALLERY_IMG}
einfügen.
Super hat perfekt geklappt!

Ich bedanke mich nochmal bei all denen die mir so super geholfen haben!

Danke schön!