Scribd Logo
Unggah

Selamat datang di Scribd!

  • OPTIMALKAN IMAGE HTML

    Diunggah oleh

    SahrunNaturalAshter
    30 tayangan2 halaman
    Laporan Pengenalan Web Pertemuan 7 Stmik Akakom

    Judul Asli

    Laporan Praktikum Pengenalan Web Pertemuan 7

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    DOCX, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    Laporan Pengenalan Web Pertemuan 7 Stmik Akakom

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai DOCX, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    30 tayangan2 halaman

    OPTIMALKAN IMAGE HTML

    Diunggah oleh

    SahrunNaturalAshter
    Laporan Pengenalan Web Pertemuan 7 Stmik Akakom

    Hak Cipta:

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

    Image

    A. TUJUAN
    Mahasiswa dapat menambahkan image kedalam dokumen html

    B. DASAR TEORI
    Beberapa cara untuk memperkecil ukuran image antara lain : image dibuat ukuran
    kecil,image sedikit warna , dan mengunakan image terkomprksi.format
    imageterkompreksi yaitu : GIF,JPEG dan PNG.
    Penggunaan image untuk latar belakang
    <body background=nama_lokasi_gambar>
    Peletakan image di dalam body html, mengunakan tag image ,dengan sintak dasar:
    <image src=URL/>
    URL absolute > untuk ke situs web lain
    URL relatif > menunjuk ke file di dalam situs web

    C. PEMBAHASAN
    <img src=pict/images.jpg" width="300px" height="200px"
    border="1px"/>
    Secript di atas akan menampilkan sebuah foto bernama image.jpg pada konten welcome
    yang berada di folder pict dengan ukuran panjang 300px, tinggi 200px, dan di beri border
    1px. Sehingga foto yang di tampilkan pada konten akan tampak seperti berikut.

    D.LATIHAN
    #content {
    //digunakan untuk mengatur isi kontent dengan
    float:left;
    //agar image dapat mengambang dan bersisihan dengan div yang lain
    display:block;
    // agar div mengikuti ukuran dan pengaturan yang telah di tetapkan
    max-width:700px;
    //ukuran content dimana akan menyesuaikan dengan isisnya
    margin-left:20px;
    // jarak antara div di sebelah kiri 20px
    margin-top:3px;
    //jarak antara div di sebelah atas 3px;

    }
    #content img {
    //digunakan untuk mengatur image yang ada di div content dengan
    width:200px;
    //lebar image 20px
    height:150px;
    //tinggi image 150px
    }

    E. TUGAS
    1. Perbedaan <image src=foto.jpg/> dengan <image src=foto.jpg
    aligan=right/>
    <image src=foto.jpg/> image akan di tampilkan di posisi default yaitu
    di sebelah kiri atas kotak atau div .
    <image src=foto.jpg aligan=right/>image akan di tampilkan di
    sebelah kanan atas kotak atau kolom.
    2. Perbedaan <image src=foto.jpg aligan =middle/> dengan <image
    src=foto.jpg aligan=top/>
    <image src=foto.jpg aligan =middle/> untuk meletakkan image di
    sebelah tengan kolom atau div
    <image src=foto.jpg aligan =top /> untuk meletakkan image di
    sebelah atas kolom.

    F. KESIMPULAN
    Dari praktikum ke 7 tentang image dapat di simpulkan css dapat
    digunakan untuk mengatur tampilan gambar atau foto yang akan di
    tampilkan di halaman web sesuai dengan keinginan kita dan dapat
    membuat web semakin menarik.

    G.LISTING
    terlampir

    Anda mungkin juga menyukai