Praktikum PHP 5

Asalammuallaikum Wr. Wb. Pada kesempatan kali ini saya akan post tentang Array, Fungsi, Modularisasi. Untuk penjelasan lebih lanjut anda dapat mendownload di blog guru saya tercinta, Bapak Hadi Wijaya, di sini. Langsung saja, kita praktekkan.

Masuk ke IDE favorit anda, saya menggunakan Adobe Dreamweaver CS6.
Buat new file lalu save dengan ekstensi *.php. Beri nama ModulHeader.php .Lalu masukan source code di bawah ini.

Lalu buat lagi file bernama ModulFooter.php. Berikut source code-nya. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <center> ========================================= ©AERDIA™ 2013|21 ========================================= </center> </body> </html>
Jangan lupa buat juga file *.css untuk memperhalus tampilannya. Berikut sourcee code css yang saya gunakan.

body{
    background: url("bg.jpg") repeat;
    
}

@keyframes flow {
  0% {background-position: 0 0;}
  100% {background-position: 0 50%;}
 
}
#hw{
 font-family:Broadway;
 font-style:oblique;
 font-weight:200;
 font-size:44px;
 -moz-animation: muncul 2s ease-in-out;
 color:#039;
 }
table{
   margin: 20px auto;
   border-radius: 10px;
   -moz-animation: bayang 1s infinite;
   background-color:  #fff;
   border-color:#003;
   border-style: solid;
   border-width: 3px;
   padding: 0px 0px;
   -moz-animation: muncul 2s ease-in-out;
   opacity:0.7;

}

table img{
 position:relative;
 opacity:0;
}
#foto {
    opacity: 1;
    position: absolute;
    right: 340px;
    top: 200px;
}
#foto img{
 border-radius:10px;
}
@keyframes muncul{
    0%{opacity:0;}
100%{opacity:100;}
}

td{
    border-radius: 10px;
    border:0;
    font-weight:bold;
    position: inherit;
 padding:10px;
    
}
select{
    
    width: 70px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;
    
}
#keptap{
    color:#fff;
    background-color: blue;
    border-radius: 10px 10px 0px 00px;
}

select:focus{
 
    width: 100px;
    border-radius: 10px;
    
    font-weight: bold;
    -moz-transition: all 1s ease-in-out;  
}
#submit,a{
    position: relative;
   border-style: solid;
   border-radius: 10px;
   border-width: 1px;
    padding: 10px 15px;
    font-weight: bold;
    opacity: 80%;
 background-color: blue;
    color:rgba(255,255,255,7);
    -moz-transition: all 5s ease-in-out;
   margin: 10px 78px;

}

textArea{
    
   
    width: 100px;
     -moz-transition-duration:  1s;
}
#inputtext{
    border-radius: 10px;
   padding: 5px 8px;
     background-color: #fff;
    width: 100px;
        -moz-transition-duration:  1s;
        background-color: #fff;
        
        
}

#inputtext:focus,textArea:focus{
   border-radius: 10px;
     background-color: #fff;
     opacity: 80%;
     color:#666;
     font-weight: bold;
    padding: 5px 8px;
    width: 240px;
    -moz-transition-duration:  1s;
   
}

Kemudian buat TestModul.php untuk menggabungkan ModulHeader.php, ModulFooter.php, PHP_2.php, serta style.css.Dan berikut source code-nya. <?php require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/ModulHeader.php"); require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/PHP_2.php"); tulistebal("<center> Kami Punya Semboyan :</center> "); echo " "; echo "<center> $kalimat</center> "; require("file:///E:/XAMPP/htdocs/PraktikumPHP212RPL3/ModulFooter.php"); ?>
Jalankan TestModul.php. Dan begini hasilnya, selamat berkreasi :).

Aerdia Blog | Luapan Inspirasi dan Emosi

Pages

Praktikum PHP 5

Tidak ada komentar:

Posting Komentar