[Guide]Mein HTML/CSS Guide by tem

  • [FONT="Arial Black"][SIZE="2"][COLOR="Purple"]H[FONT="Arial Black"]i wollte mal'n bisschen über Html zeigen.

    Bild Material könnt ihr auch downloaden.^^
    [COLOR="Red"]Bild Material[/COLOR]

    XD Virustest bei bildern^^
    [COLOR="Blue"]XD Virustest bei bildern^^ [/COLOR]

    Überschriften

    Nun hat man eine schöne Seite doch alles ist gleich groß. Wie langweilig! Wie wärs mit ein paar Überschriften? [/COLOR][/SIZE][/FONT]

    Code
    <h1> Überschrift 1</h1>
    <h2> Überschrift 2</h2>
    <h3> Überschrift 3</h3>
    <h4> Überschrift 4</h4>
    <h5> Überschrift 5</h5>
    <h6> Überschrift 6</h6>

    [SIZE="1"][COLOR="Purple"][FONT="Arial Black"]Die h1 Unterschrift ist die großte also z.B. als überschrift für webseiten gedacht. Die anderen werden immer kleiner und können z.B. für Unterüberschriften verwendet werden. Natürlich entscheidest du wie du sie verwendest ;)[/FONT].[/COLOR][/SIZE]
    ----------------------------------------------------------------------

    [SIZE="3"][COLOR="Olive"]Listen[/COLOR][/SIZE]
    [SIZE="2"][COLOR="Olive"]So die Überschriften hab hier ja schon. Jetzt ein bisschen Ordnung bringen mit ein Paar Listen.[/COLOR][/SIZE]

    symbol listen

    Code
    <ul>
    <li>Zwischen dem "ul","/ul" Tag kann eine Liste erstellt werden.</li>
    <li>"li" erzeugt eine Listenspalte/li>
    </ul>



    [COLOR="Olive"][SIZE="3"][FONT="Arial Black"]Dier gefallen die symbole nicht? Dann ändere sie doch einfach mit CSS.[/FONT][/SIZE][/COLOR]

    [SIZE="3"][COLOR="Red"]Style 1[/COLOR][/SIZE]

    Code
    <ul style="list-style-type: [COLOR="Red"]circle[/COLOR];">
    <li>Zwischen dem "ul","/ul" Tag kann eine Liste erstellt werden.</li>
    <li>"li" erzeugt eine Listenspalte/li>
    </ul>


    [SIZE="3"][COLOR="Red"]Style 2[/COLOR][/SIZE]

    Code
    <ul style="list-style-type: [COLOR="Red"]square[/COLOR];">
    <li>Zwischen dem "ul","/ul" Tag kann eine Liste erstellt werden.</li>
    <li>"li" erzeugt eine Listenspalte/li>
    </ul>


    [COLOR="Red"][SIZE="3"]Style 3[/SIZE][/COLOR]

    Code
    <ul style="list-style-type: [COLOR="Red"]disc[/COLOR];">
    <li>Zwischen dem "ul","/ul" Tag kann eine Liste erstellt werden.</li>
    <li>"li" erzeugt eine Listenspalte/li>
    </ul>


    [SIZE="3"][COLOR="SandyBrown"]
    nummerische listen[/COLOR][/SIZE]
    [SIZE="3"][COLOR="Orange"]
    Eigentlich fast das gleiche Prinzip nur<ol> statt <ul>.[/COLOR][/SIZE]

    Code
    <ol style="list-style-type: [COLOR="Red"]decimal[/COLOR];">
    <li>Zwischen dem "ol","/ol" Tag kann eine Liste erstellt werden.</li>
    <li>"li" erzeugt eine Listenspalte/li>
    </ol>

    [SIZE="2"][COLOR="Orange"]Diese codes kannst du bei statt "decimal" eintragen.[/COLOR][/SIZE]

    Code
    decimal
    Code
    decimal-leading-zero
    Code
    lower-alpha
    Code
    upper-alpha
    Code
    lower-roman
    Code
    upper-roman
    Code
    lower-greek
    Code
    hebrew
    Code
    armenian
    Code
    georgian

    [SIZE="3"][COLOR="RoyalBlue"]Erklärungs Listen^^[/COLOR][/SIZE]

    Code
    <dl>
                <dt>
             Die Sprache Englisch
                </dt>
             <dd>
              Erklärung: Englisch ist die Weltsprache. Sie wird von den meisten                  Menschen gesprochen
          </dd>
    </dl>

    [COLOR="RoyalBlue"]So siehts dann aus[/COLOR]
    -------------------------------------------------------------------
    Zitate

    [COLOR="Plum"][SIZE="4"]Ihr findet gut was ein anderer geschrieben hat? Dann Zetirt doch einfach den Beitrag von ihm.:blank:^^[/SIZE][/COLOR]

    Code
    <p> Zitat von Anybody </p>
    <blockquote cite="Anybody"><p>Godlikerz das beste Forum.</p></blockquote>


    [COLOR="Plum"][SIZE="4"]Das "cite" steht für den Autor. Denn sieht man wenn man rechstklich auf das Zitat macht und Seiten infos anzeigen klickt.[/SIZE][/COLOR]
    ----------------------------------------------------------------------

    Code

    [SIZE="2"][COLOR="DarkOrange"]Jetzt wollt ihr euren besuchern eurer Webseite mal einen Code Vorstellen z.B. einen html code. Ihr seid Ratlos wie ihr das macht? Schaut her![/COLOR][/SIZE]

    Code
    <pre>
    <code>
       Hier kannst du einen code eingeben.  
         Durch das <pre> 
       bleibt
                      die Einrückung erhalten.
    </code>
    </pre>

    [COLOR="DarkOrange"][SIZE="4"]Natürlich kannst du auch hier z.B. die schriftart der codes mit CSS ändern.[/SIZE][/COLOR]
    ------------------------------------------------------------------------

    [FELD="Schlusswort"]
    Dieser Guide ist 100% von mir geschrieben.
    Nütliche Informations Quellen waren
    [COLOR="Magenta"]video2brain[/COLOR] und css4you.de/.[/FONT]
    [COLOR="RoyalBlue"][SIZE="4"]Made by Temo (Gebt Mir doch pls ein thx/Karma wenn ihr denn Guide mögt pls.:thumbsup:)[/SIZE][/COLOR][/FELD]

  • Also von CSS steht hier mal gar nichts und diese HTML Tags sind Standard :-O
    Naja, netter Guide.
    Noch ein Tipp : Mach mal die Schrift kleiner, is ja schlimm o_o

    [RIGHT][SIZE=1]
    It'll take QQ to a whole new level.[/SIZE]
    [mad][/mad]
    [/RIGHT]

  • guter guide

    jedoch standart.....
    trotzdem wird er für Anfänger bestimmt
    hilfreich sein!

    MFG

    [CENTER]Hoffe wie immer mein betrag hat
    euch geholfen![/CENTER]

    Würde mich freuen wenn du des
    "Thanks"
    drückst! ;D

    ~+~ by Picdos ~+~

  • [FONT="Georgia"][COLOR="DarkRed"][SIZE="2"]Das bringt garnix, dort sind fast nur die sinnlosesten HTML Tags überhaupt erklärt worden.. wie wärs mit dem Aufbau? z.B. meta-Tags im Head Bereich oder so..[/SIZE][/COLOR][/FONT]

    [CENTER][/CENTER]

  • Zitat von Picdos;53151

    guter guide

    jedoch standart.....
    trotzdem wird er für Anfänger bestimmt
    hilfreich sein!

    MFG

    Ich bin mir mal sowas von sicher das du weder Ahnung von Coding noch den Post
    gelesen hast. Das ist eine Sammlung von nutzlosen CSS Atributen und kein Einsteiger
    Tutorial.

    Thread ausgraben ftw, aber nicht wenn er über 5 monate alt ist.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!