• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

css und html

L

lingenplayer

Neues Mitglied
Hallo alle in der community, ich habe mich mal versucht am html und css allerdings bekomme ich es nicht hin ein Titelbild einzufügen. Ich weiß das dass html das ich benutze schon älter ist(html 5) ,aber davon sind mehr Sachen im netz :) naja zum Fall zurück! ich schreibe die Daten hier drunter und hoffe das ihr mir erklären könnt was ich falsch mache das Titelbild(Get2Craft.jpg) soll oben in der Mitte sein :) ps ist zwar noch nicht viel aber ich bin stolz drauf :D


Code: 
<!DOCTYPE html>
<html>

<head>
    <title>Get2Craft Home</title>

    <meta charset="ISO-8859-1"/>
    <meta name="description" content=""/>
    <meta name="author" content=""/>
    <meta name="keywords" content=""/>
    <link href="stylesheet.css" type="text/css" rel="stylesheet" />


    <link href="style.css" type="text/css" rel="stylesheet">
</head>
<table align="center">
    <tr>
        <td>

            <div id="root_site"></div>
             <div class="header_backround"></div>

        </td>
    </tr>
</table>

<body>

</body>
</html>



und jetzt css


HTML: 
/* HTML Get2craft stylesheet Script 1.0*/
/* Autor lingenplayer*/

Body
{
   background: url(images/background.jpg)no-repeat;
   }

a
{

}

a:hover
{

}

a img
{

}

/* root_site setup */

#root_site
{
     margin-top: 250px;
     width: 860px;
     height: 600px;
     background-color: hsla(0, 0%, 50%, 0.5);
}

     .header_backround
     {

     height: 220px;
     width: 840px;
     background: url(images/Get2Craft.jpg)no-repeat;
     background-position: bottom;
}
 
Zuletzt bearbeitet:
ich weiß :) aber wie lernt man am besten durch die praxis. Ich habe es in hin bekommen in html muss der code rein
HTML: 
<div id="body">
    <img src="images/Get2Craft.png"
    border="0px"
    height="200"
    width="872px" />
</div>
ich danke dir viel Mals
 
Zuletzt bearbeitet:
Ich empfehle dir deinen Bildern keine Größe mitzugeben. Diese ganzen attribute, die du deinem Element mitgibst benutzt heute wirklich niemand mehr. Außerdem solltest du deinen <img> tags ein "alt" atribut mitgeben damit niemand benachteiligt wird. ;)
Weiter unten steht wie du es richtig machst, aber nur falls du das komplett ignorieren möchtest solltest du eher folgendes schreiben.

HTML: 
<style>
img{
    border: 0px;
}

.logo {
    height: 200px;
    width: 872px;
}
</style>
<img class="logo" src="images/Get2Craft.png" alt="Get 2 Craft Logo">

= = = = WIE MAN ES RICHTIG/BESSER (imho) MACHT = = = =

Erst einmal musst du wissen wie du anfängst. http://getbootstrap.com/2.3.2/ Damit kannst du wunderbar anfangen mit deiner Homepage.
Wenn du damit anfängst musst du für das was du umsetzen willst nur folgendes schreiben.

HTML: 
<img src="images/Get2Craft.png">

Bilder die du benutzt sollten immer die richtei größe haben.

Am anfang solltest du dir keine all zu großen sorgen darum machen, Was genau in dem Packet enthalten ist das du dir evtl. schon runtergeladen hast. Du wirst es mit der Zeit zu schätzen lernen. ^^

lg
 
vielem dank ich habe es so wie du oben geschrieben hast gemacht. Zwei Sachen musst du mir noch erklären XD Was ist denn das genau also das getbootstrap
und was meinst du damit
<img> tags ein "alt" atribut mitgeben damit niemand benachteiligt wird
Zum Vergrößern anklicken....
 
Das ist so nicht ganz richtig. Dem Bild Attribute für width und height innerhalb des HTML mitzugeben, entlastet die Rendering-Engine des Browsers. Ein Alt-Attribut im Image-Tag ist für W3C-validen Code ebenso verpflichtend, wie das Border-Attribute dort falsch ist, und Boostrap 2.3x empfiehlt sich nur, wenn man auch den IE8 mit abdecken will. Ansonsten sollte zur Version 3.x gegriffen werden.
 
Er meint damit Barrierefreies bzw. Armes Webdesign. Google den Begriff einfach mal so wie Bootstrap, wobei ich finde das Bootstrap am Anfang ein bisschen zu mächtig für dich ist aber sich damit auseinander zusetzen ist trotzdem nicht falsch.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben