BSI Purwokerto - Belajar Membuat Web (Part 2)


Ini kelanjutan rangkuman dari "Belajar Membuat Web (Part 1)"

TAG TABLE
<table>
   <tr>
      <td>...</td>
       <td>...</td>
    </tr>
</table>
Tr = table row               => baris
Td = table data   => kolom

ATTRIBUTE HTML
=>pemberi informasi tambahan kepada tag html

Struktur :
<nama_tag nama_attribute=”isi_attribute”>

Contoh :
<table border=”1”align=”center”>
Tag  attribute

1. Buka XAMPP (aktifkan localhost dan mysql)
2. buat file baru dengan nama : coba1.html
3. ketikkan struktur dasar html ke dalam file tsb.
<html>
<head>
   <title>MEMBUAT TABLE 1</title>
</head>
<body>
   <table border="10"align="center">
     <tr>
        <td>NAMA</td>
        <td>KELAS</td>
        <td>NILAI</td>
     </tr>
     <tr>
        <td>IRMA</td>
        <td>12.2C.21</td>
        <td>100</td>
        .....
     </tr>
   </table>
</body>
</html>
4. simpan file dan lihat hasilnya di browser.

Attribute tag table – tr – td

Align => perataan
Border        => garis tepi
Cellpadding        => jarak garis tepi dalam dengan text.
Contoh : <table cellpadding=”2”>
Cellspacing => jarak garis tepi dalam dengan garis tepi luar.
Contoh : <table cellspacing=”4”>
Width         => lebar tabel
Contoh : <table width=”500”>
Rowspan   => menggabungkan baris
Contoh : <td rowspan=”3”>
Colspan     => menggabungkan kolom
Contoh : <td colspan=”5”>
<html>
<head>
   <title>MEMBUAT TABLE 1</title>
</head>
<body>
   <table border="10"align="center"
cellpadding="3" cellspacing="10" width="800">
     <tr>
        <td rowspan="2">NAMA</td>
        <td>KELAS</td>
        <td>NILAI</td>
     </tr>
     <tr>
        <td>12.2C.21</td>
        <td>100</td>
     </tr>
   </table>
</body>
</html>

5. Terapkan attribute-attribute tsb di atas ke dalam file coba1.html

6. Membuat link dalam halaman web.

<a href=”...”>Coba</a>
Contoh :
<a href=”http://bsi.ac.id/”>BSI</a>
<a href=”coba.html”>Coba</a>
Cara membuat link

a=anchor
attribute tag <a>
href : reference (bisa alamat web/nama file)
title : keterangan saat kursor diarahkan ke link
contoh : <a title=”Halaman Profile”>
target : membuka tab baru di browser
contoh : <a target=”_blank”>

7. Menampilkan gambar ke halaman web.
          - Cari salah satu gambar, nanti ubah nama gambarnya menjadi -> image
          -Copy gambar tsb ke dalam folder latihan 1.
-src = source = alamat gambar
<img scr=”image.PNG”/>
-width = lebar gambar
<img width=”300”>
-height=tinggi gambar
<img height=”200”>

<html>
<head>
   <title>MEMBUAT TABLE 1</title>
</head>
<body>
   <table border="10"align="center"
cellpadding="3" cellspacing="10" width="800">
     <tr>
        <td rowspan="2">NAMA</td>
        <td>KELAS</td>
        <td>NILAI</td>
     </tr>
     <tr>
        <td colspan="2">12.2C.21</td>
     </tr>
   </table>
<a href=”coba.html” target="_blank"
title="membuka file coba.html">Coba</a>
<br>
<img scr=”image.PNG” />
</body>
</html>

 

Komentar

Posting Komentar

Postingan populer dari blog ini

E-learning EPTIK

Gambar
MAKALAH UNAUTHORIZED ACCESS TO COMPUTER  SYSTEM AND SERVICE ETIKA PROFESI TEKNOLOGI  INFORMASI DAN KOMUNIKASI       TUGAS MAKALAH ETIKA PROFESI TEKNOLOGI  INFORMASI DAN KOMUNIKASI Diajukan untuk memenuhi nilai Tugas Makalah Semester 6 Mata Kuliah E- learning   Etika Profesi Teknologi Informasi dan Komunikasi Disusun Oleh : Windy May Irafiana (12172825) Tanti Waluyo             (12173021) Irma Mei Harsari      (12173485) Mario Yudha Aji P   (12173687) Bimo Eka Wijanarko (12173040)   Program Studi Sistem Informasi Kampus Kabupaten Banyumas Fakultas Teknik dan Informatika Universitan Bina Sarana Informatika 2020 BAB I    1.1.             LATAR BELAKANG Kebutuhan akan teknologi jaringan komputer semakin meningkat. Selain sebagai media penyedia informasi, melalui intenet pula kegiatan komunitas komersial menjadi bagian terbesar dan pesat pertumbuhannya serta menembus berbagai batas Negara. Bahkan melalui jaringan  ini kegiatan pas
Baca selengkapnya

Jaringan Komputer

Gambar
Jenis-jenis Jaringan Komputer : 1. PAN 2. LAN 3. MAN 4. WAN Dibawah ini adalah penjelasan dari jenis jaringan komputer PAN & WAN 1. PAN (Personal Area Network) PAN adalah singkatan dari personal area network. Jenis jaringan komputer PAN adalah hubungan antara dua atau lebih sistem komputer yang berjarak tidak terlalu jauh. Biasanya Jenis jaringan yang satu ini hanya berjarak 4 sampai 6 meter saja. Jenis jaringan ini sangat sering kita gunakan. contohnya menghubungkan hp dengan komputer. Hal yang paling penting bahwa dalam PAN ini kita sendiri yang mengendalikan (authoritas) pada semua peralatan tersebut. Selain dihubungkn langsung ke komputer lewat port USB atau FireWire, PAN juga sering dibentuk dengan teknology wireless seperti bluetooth, Infrared atau WIFI. 2. WAN (Wide Area Network) WAN singkatan dari wide area network. WAN adalah jenis jaringan komputer yang mencakup area yang cukup besar. contohnya adalah jaringan yang menghubugkan suatu wilay
Baca selengkapnya

BSI Purwokerto - Belajar Membuat Web (Part 8)

Kita lanjutkan lagi materinya untuk kita bisa belajar bersama dengan cara membaca dan mempelajari materi ini .... PHP & MYSQL #Buat database menggunakan phpmyadmin 1.Aktifkan XAMPP (MySQL dan Apache Start) 2.Buka browser 3.Ketik localhost/phpmyadmin 4.Buat database dengan nama: website2c 5.Buat tabel dengan nama: login Field      Type                       Size         Keterangan ----------------------------------------------------------- User       varchar                  10            primary key Pass        varchar                  20             #Buat folder penyimpanan web 1.Tambahkan folder baru di dalam htdocs dengan nama:kelas2c 2.Tambahkan 2 folder baru di dalam kelas2c yaitu ‘config’ dan ‘img’ #Buat file untuk menghubungkan ke database mysql 1.Buat file baru di notepad++ 2.Isikan coding, simpan dalam folder ‘config’ dengan nama: koneksi.php <?php $koneksi=mysqli_connect(“localhost”,”root”,””,”website2c”); if(mysqli
Baca selengkapnya