Senin, 23 Mei 2016

Tugas Pemograman WEB

Tugas Pemograman WEB yang telah online dengan Melakukan Hosting Domain sesuai keinginan


Dengan Contoh Sebagai Berikut

http://webnyajojo.site88.net/





Diposting oleh di Tidak ada komentar:

Jumat, 08 April 2016

Membuat Tabel CSS


<html>
<head>
 <title>TABLE CSS</title>
</head>
<style>
 a{
  border: 1px solid red;
  padding: 5px 10px;
  background-color:grey;
  color: black;
  font-weight: bold;
  font-family: arial;
  text-decoration: none;
  border-radius: 5px;
  display: block;
  width: 150px;
  text-align: center;

 }
 a:hover{
  color: black;
  background-color: skyblue;

 }
 a:active{
  background-color: red;
  
 }

 table {
  border-collapse: collapse;
  width: 500px;
  margin: 25px;
  font-family: arial;
 }

tr, td {
 border: 1px solid red;
}



 .no1{
  background-color: cyan;
  border-radius: 8px 8px 0px 0px;
  border: 2px solid white;
  



 }
 .no2{
  background-color: white;
  
 }
 .no2:hover{
  background-color: grey;
 }

 .no3{
  background-color: skyblue;
 }
 .no3:hover{
  background-color: red;
 }
 .no5{
  border: 2px solid cyan;
 }
</style>
<body>

<a href="MP.html">Klik</a>

<table border="0">
 <th class="no1">No</th>
 <th class="no1">NIM</th>
 <th class="no1">Nama Lengkap</th>
 
 <tr class="no2">
  <td>1</td>
  <td>20151210</td>
  <td>Bandi</td>
 </tr>

 <tr class="no3">
  <td>2</td>
  <td>201512020</td>
  <td>Rulya Robbal</td>
 </tr>

 <tr class="no2">
  <td>3</td>
  <td>201512030</td>
  <td>Dimas</td>
 </tr>

 <tr class="no3">
  <td>4</td>
  <td>201512040</td>
  <td>Satria</td>
 </tr>

 <tr class="no2">
  <td>5</td>
  <td>201512050</td>
  <td>Driyo</td>
 </tr>

 <tr class="no3">
  <td>6</td>
  <td>201512060</td>
  <td>Sukkri</td>
 </tr>
</table>
</body>
</html>


Contoh Hasil Tabel CSS










Diposting oleh di Tidak ada komentar:

Sabtu, 02 April 2016

Contoh Pemograman WEB Memasukkan Gambar dalam Form HTML

<!DOCTYPE html>
<html>
<head>
    <title>Form</title>
    <style> 
        img{padding-right: 700px    

         }
    </style>

 </head>
<body>
<h2>Formulir Registrasi</h2>
<img src="http://www.fokatworld.net/wp-content/uploads/2016/02/Deadpool-Hindi-Dubbed-Download-205x300.jpg" align="right" >
<form method="post" action="#">
<ol type="A">
    <b><li>Data Diri</li></b>
    <table>
    <form method="post" action="#">
    <ol>
        
            <tr>
                <td>1. Nama</td>
                <td></td>
                <td></td>
                <td></td>
                <td>:</td>
                <td><input type="text" name"textname" maxlength="15">
                </td>
            </tr>
            <tr>
                <td>2. Tempat Lahir</td>
                <td></td>
                <td></td>
                <td></td>
                <td>:</td>
                <td><input type="text" name"textname" maxlength="15">
                </td>
            </tr>
            <tr>
                <td>3. Tanggal Lahir</td>
                <td></td>
                <td></td>
                <td></td>
                <td>:</td>
                <td><select name="tanggal">
                <option value="">-Pilih-</option>
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
                <option>6</option>
                <option>7</option>
                <option>8</option>
                <option>9</option>
                <option>10</option>
                <option>11</option>
                <option>12</option>
                <option>13</option>
                <option>14</option>
                <option>15</option>
                <option>16</option>
                <option>17</option>
                <option>18</option>
                <option>19</option>
                <option>20</option>
                <option>21</option>
                <option>22</option>
                <option>23</option>
                <option>24</option>
                <option>25</option>
                <option>26</option>
                <option>27</option>
                <option>28</option>
                <option>29</option>
                <option>30</option>
                <option>31</option>
            </select>
                <select name="Bulan">
                    <option>-Pilih-</option>
                    <option>Januari</option>
                    <option>Februari</option>
                    <option>Maret</option>
                    <option>April</option>
                    <option>Mei</option>
                    <option>Juni</option>
                    <option>Juli</option>
                    <option>Agustus</option>
                    <option>September</option>
                    <option>Oktober</option>
                    <option>November</option>
                    <option>Desember</option>
                </select>
                <select name="tahun">
                    <option value="">-Pilih-</option>
                    <option>1980</option>
                    <option>1981</option>
                    <option>1982</option>
                    <option>1983</option>
                    <option>1984</option>
                    <option>1985</option>
                    <option>1986</option>
                    <option>1987</option>
                    <option>1988</option>
                    <option>1989</option>
                    <option>1990</option>
                    <option>1991</option>
                    <option>1992</option>
                    <option>1993</option>
                    <option>1994</option>
                    <option>1995</option>
                    <option>1996</option>
                    <option>1997</option>
                    <option>1998</option>
                    <option>1999</option>
                    <option>2000</option>
                    <option>2001</option>
                    <option>2002</option>
                    <option>2003</option>
                    <option>2004</option>
                    <option>2005</option>
                    <option>2006</option>
                    <option>2007</option>
                    <option>2008</option>
                    <option>2009</option>
                    <option>2010</option>
                    <option>2011</option>
                    <option>2012</option>
                    <option>2013</option>
                    <option>2014</option>
                    <option>2015</option>
                    <option>2016</option>
                </select></td>
            </tr>
            <tr>
                <td>4. Jenis Kelamin</td>
                <td></td>
                <td></td>
                <td></td>
                <td>:</td>
            <td><input type="radio" name="JK" value="L">Laki-laki
            <input type="radio" name="JK" value="P">Perempuan
            </td>
            </tr>
            <tr>
                <td>5. Agama</td>
                <td></td>
                <td></td>
                <td></td>
                <td>:</td>
            <td>
            <select name="Agama">
            <option>-Pilih-</option>
                <option>Islam</option>
                <option>Keristen</option>
                <option>Protestan</option>
                <option>Buddha</option>
                <option>Hindu</option>
            </select>
            </td>
            </tr>
            <tr>
            <td>6. Golongan Darah</td>
            <td></td>
            <td></td>
            <td></td>
            <td>:</td>
            <td>
            <select name="goldar">
            <option>-Pilih-</option>
            <option>A</option>
            <option>B</option>
            <option>O</option>
            <option>AB</option>    
            </select>
            </td>
            </tr>
        </ol>
    </form>
    </table>
    <b><li>Pendidikan</li></b>
    <table>
    <ol>
        <tr>
            <td>1. Asal Sekolah</td>
            <td></td>
                <td></td>
                <td></td>
                <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>:</td>
                <td><input type="text" name"textname" maxlength="15">
                </td>
        </tr>
        <tr>
            <td>2. Tahun Masuk</td>
            <td></td>
                <td></td>
                <td></td>
                <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>:</td>
                <td><input type="text" name"textname" maxlength="4" size="5">
                </td>
        </tr>
            <tr>
            <td>3. Tahun Lulus</td>
            <td></td>
                <td></td>
                <td></td>
                <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td>:</td>
                <td><input type="text" name"textname" maxlength="4" size="5">
                </td>
        </tr>
    </ol>
    </table>
    <b><li>Data Orang Tua</li></b>
    <table>
    <ol>
        <tr>
            <td>1. Nama Ayah</td>
            <td>:</td>
                <td><input type="text" name"textname" maxlength="15">
                </td>
        </tr>
        <tr>
            <td>2. Nama Ibu</td>
            <td>:</td>
                <td><input type="text" name"textname" maxlength="15">
                </td>
        </tr>
            <tr>
            <td>3. Alamat Orang Tua</td>
            <td>:</td>
                <td><textarea name="alamat" cols="16"></textarea>
                </td>
        </tr>
        <tr>
            <td><input type="button" value="Simpan Data"></td>
        </tr>
    </ol>
    
    </ol>
</ol>
</body>
</html>



DENGAN CONTOH SEBAGAI BERIKUT
Form

Formulir Registrasi

  1. Data Diri
    2.
    1. Nama :
    2. Tempat Lahir :
    3. Tanggal Lahir :
    4. Jenis Kelamin : Laki-laki Perempuan
    5. Agama :
    6. Golongan Darah :
  2. Pendidikan
    3.
    1. Asal Sekolah :
    2. Tahun Masuk :
    3. Tahun Lulus :
  3. Data Orang Tua
    4.
    1. Nama Ayah :
    2. Nama Ibu :
    3. Alamat Orang Tua :
Diposting oleh di Tidak ada komentar:

Senin, 21 Maret 2016

Tabel HTML

 Contoh kode HTML untuk membuat tabel

<!DOCTYPE html>
<html>
<head>
    <title>Table</title>
    <style>
        table{
            font-family: arial
        }
    </style>
</head>
<body>
<h2><font face="arial">Data Nilai Mahasiswa</font></h2>
<table border="1" width="45%" cellpadding="3" cellspacing="0">
    
    <tr>
    <td rowspan="2" align="center"><b>NO</b></td>
    <td rowspan="2"><b>Nama Mahasiswa</b></td>
    <td colspan="2" align="center" width="60%"><b>Nilai Tugas</b></td>
    </tr>
    <tr>
    <td align="center">1</td>
    <td align="center">2</td>
    </tr>
    <tr>
    <td align="center">1</td>
    <td>Bonaventura</td>
    <td align="center">70</td>
    <td align="center">80</td>
    </tr>
    <tr>
    <td align="center">2</td>
    <td>Romagnoli</td>
    <td align="center">70</td>
    <td align="center">90</td>
    </tr>
    <tr>
    <td align="center">3</td>
    <td>Bartolaci</td>
    <td align="center">90</td>
    <td align="center">50</td>
    </tr>
    <tr>
    <td align="center">4</td>
    <td>Antoneli</td>
    <td align="center">90</td>
    <td align="center">60</td>
    </tr>    
    <tr>
    <td colspan="2"><b>Rata-rata</b></td>
    <td align="center"><b>80</b></td>
    <td align="center"><b>70</b></td>
    </tr>


</body>
</html>


Contoh Hasil HTML Tabel









Diposting oleh di Tidak ada komentar:

Selasa, 15 Maret 2016

Pemograman WEB

 Pemrograman Web disini yaitu mencakup HTML, PHP, MySQL (database), CSS, Java Script, Framework dan Jquery. Anda akan mempelajari dasar-dasar bahasa Pemrograman Web HTML, PHP, MySQL, CSS dan Jquery.

 Halaman Web di bangun menggunakan  HTML (Hyper Text Mark up Language).

 Pemograman Web ada 2 yaitu

  • Client Side di dalamnya HTML, Java Script dan DB
  • Server side di dalamnya PHP dan DB


HTML dan PHP bisa di jalankan berdampingan tetapi PHP tidak bisa di buatkan di HTML Maupun sebaliknya

Ada 2 cara kerja WEB


Diposting oleh di Tidak ada komentar:
Lokasi:bontang Bontang, Kota Bontang, Kalimantan Timur, Indonesia
Langganan: Postingan (Atom)