Scribd Logo
Unggah

Selamat datang di Scribd!

  • BB

    Diunggah oleh

    Funni Tan
    12 tayangan3 halaman

    Judul Asli

    bb

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    TXT, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai TXT, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    12 tayangan3 halaman

    BB

    Diunggah oleh

    Funni Tan

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai TXT, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 3

    HTML

    1. Bahasa yang digunakan untuk membuat website.


    2. Bahasa ini menggunakan penanda yang sebut �Tag�.
    3. Bahasa ini menggunakan bahasa pelengkap lain dalam membangun website yaitu
    CSS dan javascript. CSS bertugas untuk merubah tampilan dari web sedangkan html
    bertugas untuk membuat struktur dasar website.
    4. Contoh dokumen html
    5. <!DOCTYPE html>
    6. <html lang="en">
    7. <head>
    8. <title>Belajar HTML #01</title>
    9. </head>
    10. <body>
    11. <p>Hello World!</p>
    12. </body>
    13. </html>
    5. Struktur dasar Html terdiri dari tiga bagian yaitu bagian deklarasi, bagian
    head dan bagian body.
    6. Tag, elemen dan atribut merupakan tiga bagian penting yang ada didalam html.
    7. Tag pada html terdiri atas tag pembuka dan tag penutup yang diakhiri dengan
    tanda </>
    <i><b><u>memasak</u></b></i>
    8. Atribut adalah kata khusus atau modifier yang pada tag pembuka html yang akan
    menentukan perilaku dai element. Terdiri dari nama atribut dan nilai atribut.
    9. Atribut html terdiri dari tiga jenis yaitu atribut global, atribut event, dan
    atribut khusus.
    10. Atribut dalam html disarankan ditulis dengan menggunakan huruf kecil,
    menggunakan tanda petik
    <p align="center">Belajar HTML di Petani Kode</p>

    <h1 title="tutorial HTML untuk pemula">Belajar HTML</h1>


    12. Element juga disebut sebagai node merupakan komponen yang menyusun dokumen
    html (dokumen tree) dimana terdiri dari tiga jenis node yaitu node elemen, node
    atribut dan node teks.
    13. Element terbentuk dari tag pembuka hingga tag penutup.

    BOOTSTRAP
    1. Bootstrap adalah framework CSS yang menyediakan class-class CSS dan beberapa
    fungsi Javascript untuk mempermudah pembuatan web.

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bootstrap dari Lokal</title>

    <link rel="stylesheet" href="css/bootstrap.min.css" />


    </head>
    <body>

    <header class="py-5 bg-success">


    <div class="container">
    <h1 class="display-4 text-white">Hello Bootstrap Lokal!</h1>
    </div>
    </header>
    <script src="js/bootstrap.min.js"></script>
    </body>
    </html>
    2. Bootstrap pada html:
    ? Menggunakan bootsrap dengan CDN
    ? Download bootsrap dengan manual
    ? Menggunakan bootsrap dengan packages manager
    3. Script dari bootstrap diakses dengan menggunakan tag <link> dan tag <script>.
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <script src="js/bootstrap.min.js"></script>
    4. Sistem grid pada bootsrap adalah sistem tata letak yang digunakan layout atau
    tata letak.
    5. Sistem grid ini terdiri dari 12 kolom dan 6 breakpoint.
    6. Breakpoint adalah ukuran lebar yang menentukan tapilan responsif terhadap
    ukuran viewpoint perangkat tertentu.
    7. Ukuran Breakpoint, yakni none, sm, md, lg, xl, dan xxl.
    8. Contoh:
    <div class="col-12">
    <!-- ukuran kolom ini 12 -->
    </div>
    <div class="col-6">
    <!-- ukuran kolom ini 6 -->
    </div>

    Navbar pada aplikasi mobile


    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Bottom Navbar Bootstrap</title>
    <link rel="stylesheet"
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
    integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
    crossorigin="anonymous">
    </head>
    <body>

    <!-- Bottom Navbar -->


    <nav class="navbar navbar-dark bg-info navbar-expand d-md-none d-lg-none d-xl-
    none">
    <ul class="navbar-nav nav-justified w-100">
    <li class="nav-item">
    <a href="#" class="nav-link">Home</a>
    </li>
    <li class="nav-item">
    <a href="#" class="nav-link">Cari</a>
    </li>
    <li class="nav-item">
    <a href="#" class="nav-link">Add</a>
    </li>
    <li class="nav-item">
    <a href="#" class="nav-link">Notif</a>
    </li>
    <li class="nav-item">
    <a href="#" class="nav-link">Profile</a>
    </li>
    </ul>
    </nav>
    <article class="container py-5">
    <h1 class="h1">Belajar Membuat Bottom Nav</h1>
    <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Nostrum
    exercitationem alias libero mollitia esse, illum odio ex perspiciatis omnis
    voluptate ducimus, corporis cupiditate nobis corrupti voluptatum fugit at dolor
    eaque.</p>
    </article>

    </body>
    </html>

    Anda mungkin juga menyukai