Scribd Logo
Upload

Welcome to Scribd!

  • Desain Web

    Uploaded by

    safitririka636
    7 views6 pages
    materi desain web

    Original Title

    desain web

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    materi desain web

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    7 views6 pages

    Desain Web

    Uploaded by

    safitririka636
    materi desain web

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 6

    1. Heading (size) 2.

    Cara Membuat Font dan Background


    <html> <html>
    <title> Selamat Belajar </title> <head>
    </head> <title> Format Text </title>
    <body> <h1> Belajar HTML </h1> </head>
    <h2> Belajar HTML <h2> <Body Bgcolor ="Lavender">
    <h3> Belajar HTML </h3> <Font Size = "6" Face ="courir"
    <h4> Belajar HTML <h4> color = "red"> Bunga Nusa Indah </font><BR>
    <h5> Belajar HTML </h5> Berwarna Merah<BR>
    <h6> Belajar HTML <h6> </body>
    </body> </html>
    </html>

    Hasil Kode Program


    Hasil Kode Program
    3. Membuat Daftar Nama-Nama Hasil Kode Program
    Hewan dan Buah
    <html>
    <head>
    <ul type ='disck'> DAFTAR NAMA BUAH
    </head>
    <li> 1. Rambutan </li>
    <li> 2. Durian </li>
    <li> 3. Beruang </li>
    <li> 4. Manggis </li>

    <ul type ='disck'> DAFTAR NAMA HEWAN


    <li> a. Ikan </li>
    <li> b. Ayam </li>
    <li> c. Beruang </li>
    <li> d. Harimau </li>
    </body>
    </html>
    4. Cara Membuat Layout Hasil Dari Kode Program
    <!DOCTYPE html>
    <html>
    <head>
    <title> CONTOH MEMBUAT LAYOUT</title>
    </head>
    <body>
    <header>
    <p>Header</p>
    </Header>
    <nav>
    <p>navbar</p>
    </nav>
    <article>
    <p>Konten</p>
    </article>

    <footer>
    <p>Footer</p>
    </footer>
    </body>
    </html>

    <style>
    body {width : 65% ; height : auto; background: white; margin : auto;
    margin-tp: 5px ; padding-bottom : 5 px; }
    p {text-align:center; font-size: x-large; margin : auto;}
    header, nav, article, footer {border-radius: 3px ; margin : 5px 5px 5px 5px;
    border : 1px solid gainsboro;}
    header {height : 80px; background-color : aquamarine;}
    nav {height : 45px; background-color : blanchedalmond;}
    article {height : 150px; background-color : cornflowerblue;}
    footer {height :50px; background-color : darkkhaki;}
    </style>
    5. Cara membuat form di HTML Hasil Dari Kode Program
    <html>
    <head>
    <title> Form Login </title>
    </head>
    <body>
    <form action = "login.php" methode="post">
    <fieldset>
    <legend> login </legend>
    <p>
    <label> username : </label>
    <input type = "username" name = "username" placeholder =
    "username..."/>
    </p>
    <p>
    <label> password = </label>
    <input type = "password" name = "password" place holder =
    "password..."/> Formulir (part. 2)
    </p> <html>
    <p> <head>
    <label><input type = "checkbox" name = "remember" value = <title>Registrasi</title>
    remember"/> </head>
    remember me </label> <body>
    </p> <form action="contact.php" method="POST">
    <p> <fieldset>
    <input type = "submit" name = "submit" <legend>Registrasi</legend>
    value = "log in"/> <p>
    </p> <label>Nama:</label>
    </fieldset> <input type="text" name="nama" placeholder="Nama lengkap..." />
    </body> </p>
    </html> <p>
    <label>Username:</label>
    <input type="text" name="username" placeholder="Username..." />
    </p> </fieldset>
    <p> </form>
    <label>Email:</label> </body>
    <input type="email" name="email" placeholder="Your email..." /> </html>
    </p> Hasil Kode Program
    <p>
    <label>Password:</label>
    <input type="password" name="password"
    placeholder="Passowrd..." />
    </p>
    <p>
    <label>Jenis kelamin:</label>
    <label><input type="radio" name="jenis_kelamin" value="laki-laki" />
    Laki-laki</label>
    <label><input type="radio" name="jenis_kelamin"
    value="perempuan" /> Perempuan</label>

    </p>
    <p>
    <label>Agama:</label>
    <select name="agama">
    <option value="islam">Islam</option>
    <option value="kristen">Kristen</option>
    <option value="hindu">Hindu</option>
    <option value="budha">Budha</option>
    </select>
    </p>
    <p>
    <label>Biografi:</label>
    <textarea name="biografi"></textarea>
    </p>
    <p>
    <input type="submit" name="submit" value="Daftar"
    </p>
    Formulir (Part.3) Hasil Kode Program

    <!DOCTYPE html>
    <html>
    <head>
    <title>Form HTML</title>
    </head>
    <body>
    <form action="contact.php" method="POST">
    <fieldset>
    <legend>Form</legend>
    <p>
    <label>Alamat Web:</label>
    <input type="url" name="name" placeholder="Masukan URL
    Web..." />
    </p>
    <p>
    <label>Tanggal Lahir:</label>
    <input type="date" name="tanggal" />
    </p>
    <p>
    <label>Umur:</label>
    <input type="number" min="10" max="90" name="umur" />
    </p>
    <p>
    <input type="submit" name="submit" value="Send" />
    </p>
    </fieldset>
    </form>
    </body>
    </html>

    You might also like