NemProgrammering.dk logo
3 måneders gratis webhotel til alle NemProgrammering.dk brugere! Få din UnoEuro Rabatkode her
UnoEuro rabatkode

HTML5 form inputs og attributter

WordPress hjemmeside hjælp

Information om denne video

Underviser: Joakim Børlum Petersen, www.Snowhat.dk

I denne video fortæller vi om de nye tiltag inden for formularer i HTML5. Vi kommer blandt andet in på de nye attributter og attribut værdier der nu findes inden for HTML5. Det skal igen nævnes, at der findes flere nye form attributter i HTML5 end dem vi nævner i denne video. Derfor kan det anbefales, at du selv tager et nærmere kig på alle de nye og spændende funktioner og muligheder.

Herunder finder du koderne der bliver lavet i videoen - Kopier dem gerne!

Video tags:

Denne video relaterer til emner såsom: HTML5 kursus, HTML5 guide, Gratis HTML5 undervisning, HTML5 video tutorials på dansk, HTML5 introduktion, formularer i HTML5, HTML forums, form atttributter

Her har du kildekoden

<!DOCTYPE html>
<html>
<head>
    <title>Vi leger med HTML5 forms</title>
    <style>
        body{
            background: #242424;
            font-family: Arial;
            color: #eee;
        }
        fieldset{
            position: absolute;
            top: 10%;
            left: 50%;
            margin-left: -150px;
            background: #494949;
            width: 300px;
            border-radius: 5px;
            box-shadow: 2px 1px 5px #080808;

        }
        legend{
            color: #969696;
        }
        label{
            float: left;
            width: 120px;
        }
        input{
            border-radius: 2px;
        }
        input[type="submit"]{
            float: right;
        }
    </style>
</head>
<body>
    <form>
        <fieldset>
            <legend>Login</legend>
            <div>
                <label for="username">Brugernavn</label>
                <input type="email" name="username" id="username" autofocus required placeholder="Jens2012">
                <label for="password">Adgangskode</label>
                <input type="password" name="password" id="password" required placeholder="Dit adgangskode">
                <input type="submit" name="login" id="login" value="Login">
            </div>
        </fieldset>
    </form>
</body>
</html>
        

Spørgsmål og kommentarer

Har du spørgsmål eller kommentarer? Så skriv herunder! Alternativt kan du kontakte os på vores forum, hvor en masse hjælpsomme personer sidder klar ved tasterne.

Url´er bliver automatisk omdannet til links (nofollow).

kommentar på NemProgrammering.dk - lav din egen hjemmeside
Freddy    22-04-2014

Hej Thomas Endnu en gang tak for svar. Det var faktisk lige præcis det jeg eftersøgte. Jeg var slet ikke opmærksom på CSS og Style Sheets, men med din henvisning har jeg nu kigget på det, så jeg går i gang med Jeres video'er om CSS - så endnu engang tusind tak. Med venlig hilsen Freddy


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Thomas    21-04-2014

Hej igen Freddy, Ah ok, jamen når du benytter style attributten, så er det jo fordi du går igang med at lave inline css styling. Det vil sige at Netbeans sandsynligvis vil vise dig alle de egenskaber du kan style dit element med. Dette har som sådan ikke noget at gøre med forms specifikt, da du jo kan style alle elementer. Du kan her se et komplet overblik over alle css egenskaber her: http://www.blooberry.com/indexdot/css/propindex/all.htm


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Freddy    21-04-2014

Hej Thomas Tak for hurtigt svar. Jeg har set på de to sider, og kan se, at jeg der kan finde svar på mange spørgsmål, men ikke præcis på det jeg havde i tankerne. Jeg tror jeg har udtrykt mig uklart. Det jeg referer til (og det kunne du jo naturligvis ikke vide) var ovenstående eksempel, hvor man under style kan angive parametre som background og color til body, width og border-radius til fieldset. Men det er jo kun 2 ud af den lange liste af muligheder der kommer frem i NetBeans og som nybegynder ville det være rart med en beskrivelse af de muligheder der er. Med venlig hilsen Freddy


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Thomas Skov Iversen    21-04-2014

Hej Freddy, Se evt. nederst på siden her: http://www.w3schools.com/html/html_forms.asp Ellers er w3c jo altid det officielle sted at få viden: http://www.w3.org/TR/html401/interact/forms.html


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Freddy    21-04-2014

Jeg har med stor glæde fulgt Jeres forskellige videos om HTML, PHP og MySQL og prøvet dem i praksis. Og det virker jo (selvfølgeklig ;-). Jeg har på det sidste siddet og leget lidt med HTML forms og kan se at der er flere hundrede mulige parametre (body, fieldset, label o.s.v.), men som nybegynder der ikke kender mulighederne, vil jeg gerne spørge Jer, om I kender en hjemmeside, hvor alle disse parametre er beskrevet. med venlig hilsen Freddy


kommentar på NemProgrammering.dk - lav din egen hjemmeside
Dennis Munding    25-01-2013

Lige til orientering... "required" i formularer er IKKE nyt. Det eneste nye er, at man kan nøjes med at skrive required i stedet for som tidligere at skulle skrive required="required".