Grundaufbau einer modernen Page

  • ja dein Script muß unterhalb des Elements . Du sprichst ganz oben das Element an ,was noch gar nicht da ist.

    Deswegen mußt du die reinfolge einhalten die ich gemacht habe ,dann solte auch dein Script gehen.

    Code
    1. <main id="main">test</main>
    2. <script type="text/javascript">
    3. document.getElementById("main").style.color = "#ff0000";
    4. </script>

    Aber trotzdem dran denken.

    Korekter wäre so

    Code
    1. <main id="main1">test</main>
    2. <script>
    3. document.getElementById("main1").style.color = "#ff0000";
    4. </script>
  • Was meinst du denn genau mit dynamisch? Ich verstehe unter einer dynamischen Webseite nicht nur HTML 5 Code ala.

    <header><nav>... dynamisch bedeutet für mich dass man HTML, PHP und eine Datenbank verwendet.

    Internet Videos wie YT sind nicht geeignet, da die meisten Tutorials einfach veraltet sind.

  • Jetzt stehe Ich mal wieder auf dem Schlauch...


    wenn ich ein link <a href="bla.php">test</a> auf meine page platziere, passiert folgende:

    "TEST"

    der Linkabschnitt beginnt beim linken "T" exakt bei Buchstabenbeginn, endet beim rechten "T" jedoch nich exakt beim Buchstabenende, sondern ca. 20-40px. weiter.


    Das ist ein wenig dämlich, da Ich so nur auf Umwegen eine saubere Zentrierung des Abschnitts erreichen kann.


    Kennt jemand das Problem und hat eine Lösung?

    (z.B. Definierung der "Klickflächengröße" oder so...)


    Gruß!

  • So nun hab ich die nächste Frage (ja, dipl. kfm., die HTML/CSS/JAVA/PHP lernen wollen, sind nervig...):


    Aus einem mir nicht erklärbarem Grund krieg ich manche "font-colors" nicht hin, es scheint als hätte ich irgendwo was definiert, was das verhindert:


    Beispiel:


    html:

    <main id="downloadmain">


    <h3 id="h3dl">downloads, free, maybe useful and nice stuff, written by tb: </h3>

    <p> please donate:<p/>

    <p>btc: 36HUdFeMA8wBgj9sVjydb4h2Fzker98itn</p>

    <p>eth: 0x97b75c4e2448aCB5F022e59f6d9D99cF4C7D016d</p>


    <ul id="downloadlinks">

    <li><a href="downloads/html.css.php-inc.framework.rar" download="html.css.php-include.framework.rar">html / css / php-include basic-framework .rar</a></li>


    </ul>


    CSS:

    #downloadmain {

    padding-top: 43px;

    text-align: center;

    }

    #h3dl {

    text-decoration: underline;

    }

    #downloadlinks {

    display: inline-block;

    list-style: none;

    width:auto;

    color: #173603;

    }




    Kann mir jemand sagen warum die <ul> die Farbe nicht annimmt? Diesen Fehler habe Ich mehrfach auf meiner Page.


    Ich würde notfalls auch den ganzen "file" posten, falls in diesem Abschnitt kein Fehler ist( Ich selber finde Ihn leider nicht :( )


    Gruß Thorsten


    p.s. wenn Ich euch in Office-Organisation oder Logistic-Management helfen könnte, fragt einfach.... ich kann das eigentlich nicht, permantent was zu fragen und nichts zu geben...


    Gruß Thorsten

  • Ok, jetzt funktioniert es doch. Nice work, danke :)


    Ich habe aufgrund des Vorgangs eine Folgefrage:


    CSS:

    wie sage ich CSS,dass das [id="Beispiel"] "li, a" {...} nur für id="Beispiel" gilt?

    Denn als Folgefehler resultiert aktuell bei mir: aufgrund [id="Beispiel"] "li, a" {...} werden alle "li, a" mit den Attributen behandelt. Das ist nach meinem / fast allen (logischerweise...) Konzepten nicht sinngemäß.


    (Kein Scherz, während meines ganzem Studiums ist mir nie so schöner Lernstoff begegnet... viel schöner als BWL/VWL/Logistics)


    Gruß T.

    Dieser Beitrag wurde bereits 2 Mal editiert, zuletzt von Thorsten B. ()

  • Nein.. mit dem Komma getrennt gilt es für sowohl als auch...

    #Beispiel li -> nur für li im Container #Beispiel

    #Beispiel li a -> nur für a im li im Container #Beispiel

    #Beispiel li, a -> für li im Container #Beispiel und für a (egal wo)

  • Nein.. mit dem Komma getrennt gilt es für sowohl als auch...

    #Beispiel li -> nur für li im Container #Beispiel

    #Beispiel li a -> nur für a im li im Container #Beispiel

    #Beispiel li, a -> für li im Container #Beispiel und für a (egal wo)

    mmh kein Scherz, Ich finde meinen Fehler nicht!


    Kann mir einer sagen warum sich die "color" in "#copywright" ebenfalls ändert, wenn Ich die "color" in "#downloadlinks li a {}" ändere ?? (Ändert sich in den angegebenen Wert in #downloadlinks...)


    Ich peils nicht :(



    html {

    background-image: url(img/welcome.gif);

    }

    body {

    font-family: 'Orbitron', sans-serif;

    color: #173603;

    }

    header {

    width: 100%;

    height: 247px;

    vertical-align: top;

    }

    #nav1 {

    list-style: none;

    }

    #navlink {

    display: inline-block;

    float: right;

    padding-right: 110px;

    margin-top: 175px;

    }

    #copywright{

    display: inline-block;

    float: right;

    padding-right: 140px;

    padding-top: 25px;

    list-style: none;

    vertical-align: bottom;

    color: #173603;

    }

    footer {

    width: 100%;

    height: 125px;

    bottom: 0px;

    position: fixed;

    }

    #home {

    text-align: center;

    }


    #f1 {

    opacity: 0.75;

    width: 300px;

    height: 400px;

    }

    #f1, #p1 {

    display: inline-block;

    text-align: left;

    padding-left: 25px;

    }


    #downloadmain {

    padding-top: 43px;

    text-align: center;

    }

    #h3dl {

    text-decoration: underline;

    }

    #downloadlinks li a {

    display: inline-block;

    list-style: none;

    width:auto;

    color: #4AA74F;

    }





    :(((((

  • Poste bitte den gesamten Code... HTML und CSS lassen sich nur als Einheit bewerten!

    Besser noch wäre ein Link zur Seite - erspart jedem der dir helfen eine Menge Arbeit.

  • ich vermute das #copywright im Container #downloadlink ist und wohl ein <a> element.


    Wenn ich recht habe Kopiere den Teil ans Ende der Css

    Code
    1. #copywright{
    2. display: inline-block;
    3. float: right;
    4. padding-right: 140px;
    5. padding-top: 25px;
    6. list-style: none;
    7. vertical-align: bottom;
    8. color: #173603;
    9. }

    Aber ohne Kompletten Code kann man nur raten

    Dieser Beitrag wurde bereits 2 Mal editiert, zuletzt von basti1012 ()

  • Irgendwie habe ich den Eindruck hier wird die Geduld der Unterstützer weit über das normale Maß hinaus strapaziert. Was ist denn an diesem HTML/CSS-Code so besonderes, dass er nicht gezeigt werden kann. Das wäre eine große Hilfe für alle hier. Im Übrigen würde ich vorschlagen mal die Seite https://www.html-seminar.de/ komplett durchzuarbeiten, um ein Grundwissen aufzubauen.