[Html] Browser + Skalierung

10/16/2011 11:57 Levi$#1
hey,

ich bin gerade fleißig am html schreiben und habe mich grade erinnert, das nicht alle firefox nutzen :/. Wie kann ich das am geschicktesten anstellen alle Browser einzubinden. Noch wichtiger ist mir aber das sich mein design nicht verschiebt, wenn man andere bildschirme verwendet.

Bitte um hilfe ^^

danke

niko
10/16/2011 12:23 NotEnoughForYou#2
Wie meinste dass für alle Browser einbinden?

Indem du deinem Inhalt eine feste Breite gibst und diesen dann zentrierst.

PHP Code:
#wrapper {
width:800px;
margin:0px auto;

10/16/2011 23:48 Ennea#3
Um deine Seite in allen gängigen Browsern lauffähig zu bekommen gibt es eine einfache Regel: benutze nur standardkonformes HTML und CSS. Es bleiben immer noch einige vereinzelte Eigenarten in diversen Browsern übrig, welche sich aber umgehen/ausbessern lassen.
10/17/2011 00:06 Devil589#4
Da kann ich noch diese nette Seite hier empfehlen.

[Only registered and activated users can see links. Click Here To Register...]

Da kannst du einfach den Sourcecode deiner Seite checken lassen und siehst was du noch ausbessern solltest um den W3C standard beizubehalten.
10/17/2011 09:06 Ennea#5
Quote:
Originally Posted by Devil589 View Post
Da kann ich noch diese nette Seite hier empfehlen.

[Only registered and activated users can see links. Click Here To Register...]

Da kannst du einfach den Sourcecode deiner Seite checken lassen und siehst was du noch ausbessern solltest um den W3C standard beizubehalten.
Äquivalent für CSS:
[Only registered and activated users can see links. Click Here To Register...]

:p
10/17/2011 10:14 Levi$#6
ich hätte noch ne weitere frage :/

hoffe das ihr mir das richtig erklären könnt denn die sufu und google könnens nicht -.-

ich verstehe das mit dem "a" bei html und css nicht bsp: #navigation a {}

und hier gleich die nächste. wie groß müssen bilder sein damit sie über die ganze breite der seite gehen? und rein als bsp.: epvp, sind da die ganzen elemente von Gaaanz oben bis kontrollzentrum ein bild oder mehrere elemente. Ich wollte nämlich sowas ähnliches machen wie hier,

Willkommen, XXX l Private Nachrichten: XXX l Premium werden l E-gold l Abmelden

dahinter ist ja ein bild, ist das in dem fall der ul zugeschrieben oder ist das ganze desgin nur 1 einziges bild.

ich habe das gestern versucht im header ul, ein bild einzufügen damit es ca so aussieht wie hier, jedoch erscheint das bild erst garnicht -.-

{background-image: url (source)}


danke =)
10/17/2011 10:27 NotEnoughForYou#7
Quote:
Originally Posted by Levi$ View Post
ich hätte noch ne weitere frage :/

hoffe das ihr mir das richtig erklären könnt denn die sufu und google könnens nicht -.-

ich verstehe das mit dem "a" bei html und css nicht bsp: #navigation a {}

und hier gleich die nächste. wie groß müssen bilder sein damit sie über die ganze breite der seite gehen? und rein als bsp.: epvp, sind da die ganzen elemente von Gaaanz oben bis kontrollzentrum ein bild oder mehrere elemente. Ich wollte nämlich sowas ähnliches machen wie hier,

Willkommen, XXX l Private Nachrichten: XXX l Premium werden l E-gold l Abmelden

dahinter ist ja ein bild, ist das in dem fall der ul zugeschrieben oder ist das ganze desgin nur 1 einziges bild.

ich habe das gestern versucht im header ul, ein bild einzufügen damit es ca so aussieht wie hier, jedoch erscheint das bild erst garnicht -.-

{background-image: url (source)}


danke =)
a steht für den <a> tag (link) das heitß mit
PHP Code:
#navigation a {} 
wird
PHP Code:
<div id="navigation"><a href="#">Link</a></div
angesprochen.

Es ist nicht der Sinn, dass man ein bild macht, dass so groß wie der ganze bildschirm ist. Meist verwendet man eine hintergrundfarbe und einen zentrierten background.

Elitepvpers ist aus mehreren "Bildern" zusammen gesetzt.

Für das was du machen willst, also Willkommen xxx etc. braucht du PHP ( wenn es nicht nur so aussehen soll )


Ein Bild :
PHP Code:
#header {
background:url("pfad zum bild") ;
width:200px/* Ist natürlich änderbar, jenachdem wie groß es ist */
height:200px/* genauso änderbar */

und in der html
PHP Code:
<div id="header"></div
10/17/2011 10:41 Levi$#8
Quote:
Originally Posted by NotEnoughForYou View Post
a steht für den <a> tag (link) das heitß mit
PHP Code:
#navigation a {} 
wird
PHP Code:
<div id="navigation"><a href="#">Link</a></div
angesprochen.

Es ist nicht der Sinn, dass man ein bild macht, dass so groß wie der ganze bildschirm ist. Meist verwendet man eine hintergrundfarbe und einen zentrierten background.

Elitepvpers ist aus mehreren "Bildern" zusammen gesetzt.

Für das was du machen willst, also Willkommen xxx etc. braucht du PHP ( wenn es nicht nur so aussehen soll )


Ein Bild :
PHP Code:
#header {
background:url("pfad zum bild") ;
width:200px/* Ist natürlich änderbar, jenachdem wie groß es ist */
height:200px/* genauso änderbar */

und in der html
PHP Code:
<div id="header"></div

also ich weis echt nicht was ich falsch mache: es kommt garkein bild -.-

Html
PHP Code:
<div id="menu">
    <
ul>
         <
li><a href="start.html">Startseite</a></li>
             <
li><a href="news.html">News</a></li>
            <
li><a href="infos.html">Informationen</a></li>
           <
li><a href="galerie.html">Galerie</a></li>
            <
li><a href="links.html">Links</a></li>
            <
li><a href="kontakt.html">Kontakt</a></li>
            <
li><a href="impressum.html">Impressum</a></li>
        
    </
ul>
    </
div
Css
PHP Code:
#menu 
{    
    
background:url("/images/Taskleiste.jpg");
    
    
}



#menu ul
{
    
margin0px;
    
padding0px 0px 0px 354px;
    list-
style-typenone;
}
#menu ul li
{
    
padding0px 0px 0px 31px;
    
margin5px;
    
width20%;
    
displayinline;    

10/17/2011 10:43 NotEnoughForYou#9
entfern das inline und gib dem div ne feste weite
10/17/2011 10:47 Levi$#10
Quote:
Originally Posted by NotEnoughForYou View Post
entfern das inline und gib dem div ne feste weite
tut sich auch nix, wenn ich das so verstanden hab. inline weg, #menu {width: 300px;}

jz hab ich kein bild und ul ist jz senkrecht :/
10/17/2011 10:51 NotEnoughForYou#11
natürlich ist ul li senkrecht, wenn du es vertical willst ein float:left; geben ... sicher dass der pfad zum bild richtig ist?
10/17/2011 10:57 Levi$#12
Quote:
Originally Posted by NotEnoughForYou View Post
natürlich ist ul li senkrecht, wenn du es vertical willst ein float:left; geben ... sicher dass der pfad zum bild richtig ist?
das mit dem float, danke <3 ^^

ahm ich hab den ganzen ordner mal aufm desktop geklatscht. Bild ist im unterordner images. als pfad geb ich an (/images/Bild.jpg)
10/17/2011 11:04 NotEnoughForYou#13
also deine idnex bzw.die seite die du aufrufst ist in dem ordern wo dann der ordner images ist?
10/17/2011 11:19 Levi$#14
Quote:
Originally Posted by NotEnoughForYou View Post
also deine idnex bzw.die seite die du aufrufst ist in dem ordern wo dann der ordner images ist?
nein index liegt auserhalb aller ordner.

->web->images->mein bild
->web->index
->web->style->style.css
10/17/2011 11:21 NotEnoughForYou#15
dann mach das / vor images weg ;)