Minggu, 07 November 2010

TUGAS CSS

index.htm
<html>
<head>
<title>MOCHAMAD ZAQI WEB'S</title>
<!--htmlink.htm-->
<frameset rows=20%,* border=20>
<frame src="topframe.htm"name="atas" scrolling="no" noresize>
<frameset rows="*" cols="19%,81%">
<frame src="leftframe.htm" name="kiri" noresize>
<frame src="rightframe.htm" name="kanan">
</frameset>
<noframes></noframes>
</head>
</html>

leftframe.htm
<html>
<head>
<link rel="stylesheet" type="text/css" href="css.css">
<title>leftframe</title>
<!--htmlink.htm-->
<frame>
<body class="bodyleft">
<div class="leftlinks">
<a href="rightframe.htm"target="kanan"><font class="sp2">Home</font></a>
<a href="profile.htm"target="kanan"><font class="sp2">Profile</font></a>
<a href="warna1.htm"target="kanan"><font class="sp2">warna 1</font></a>
<a href="warna2.htm"target="kanan"><font class="sp2">warna 2</font></a>
<a href="warna3.htm"target="kanan"><font class="sp2">warna 3</font></a>
<a href="gallery.htm"target="kanan"><font class="sp2">Gallery</font></a>
<a href="bukutamu.htm"target="kanan"><font class="sp2">Buku Tamu</font></a>
<a href="contact.htm"target="kanan"><font class="sp2">Contact Us</font></a>
</div>
</body>
</frame>
</head>
</html>

css.css

.sp1 {
font-size: 20px;
color:#FFFFFF;
}
.sp2 {
font-size: 20px;
color:#FFFFFF;
}
.sp3 {
font-size: 28px;
color:#FFFFFF;
}
.bodytop {
background-color:black;
}
.bodyleft {
background-color:red;
}
.bodywarna1 {
background-color:#00FF00;
}
.bodywarna2 {
background-color:#3366FF;
}
.bodywarna3 {
background-color:#FFFF00;
}
.leftlinks {
border:1px solid #22476C;
padding:5px;
margin:5px;
text-align:middle;
background-color:#FF0000;
width:150px; }
.leftlinks a {
display:block;
margin:3px 0px;
border-top:1px solid #4C86C0;
border-left:1px solid #4C86C0;
border-right:1px solid #22476C;
border-bottom:1px solid #22476C;
padding: 4px 10px;
text-align:center;
background-color:#000000;
color:#EDEDED;
text-decoration:none; }
.leftlinks a:link {
color:#EDEDED; }
.leftlinks a:visited {
color:#EDEDED; }
.leftlinks a:hover {
display:block;
margin:3px 0px;
border-top:1px solid #22476C;
border-left:1px solid #22476C;
border-bottom:1px solid #4C86C0;
border-right:1px solid #4C86C0;
padding: 5px 9px 3px 11px;
text-align:center;
background-color:#336699;
color:#EED929;
text-decoration:none; }

ini tampilan background css dan TOMBOL 3 D pada CSS


Sabtu, 23 Oktober 2010

TUGAS 3 MEMBUAT FRAME PADA NHTML

TUGAS 3 MEMBUAT FRAME PADA HTML
 

1.index.htm

<html>
<head>
<title>zaki</title>
<link ilo-full-src="mac.ico" rel="SHORTCUT ICON" href="mac.ico" type="image/x-icon">
<script language="JavaScript1.2">
var message=">>>> MOCHAMAD ZAQI <<<<<"; 
var message=message+"          "
i="0"                                
var temptitle=""                
var speed="150"                 
function titler(){
if (!document.all&&!document.getElementById)
return
document.title=temptitle+message.charAt(i) 
temptitle=temptitle+message.charAt(i)      
i++                                           
if(i==message.length)                           
{
i="0"                                           
temptitle=""                                   
}
setTimeout("titler()",speed)                   
}
window.onload=titler
</script>
</head>
<frameset rows = "35%,*,6%" cols="*">
        <frame src = "title.htm" scrolling = "no">

<frameset rows="*" cols = "21%,*,23%">
        <frame src = "menu.htm" scrolling = "no">
        <frame src = "tama.htm" scrolling = "no">
</frameset>
        <frame src = "title2.htm" scrolling = "no">
</frameset>
<noframes></noframes>

</html>
 



Ini tampilan index.htm


 2. profile.htm
<html>
<head>
<title>ISI</title>
</head>
<h1 align="center"> DATA DIRI </h1>
<body background="white">


<div align="left">
  <table width="803" height="118" border=0">
    <tr>
      <td width="409"><ol>
        <strong>Nama &nbsp;&nbsp;&nbsp;&nbsp;  : MOCHAMAD ZAQI<br>
        Kelas &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: 5 D Sore<br>
        NIM  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : 08.10802.00181<br>
        Fakultas &nbsp;: Teknik<br>
        Jurusan &nbsp;&nbsp; : Informatika<br>
        Motto &nbsp;&nbsp;&nbsp;&nbsp; : Tak ada rahasia untuk menggapai sukses. Sukses itu dapat terjadi karena persiapan, kerja keras, dan mau belajar dari kegagalan.<br>
        Alamat &nbsp;&nbsp;&nbsp;&nbsp; : Mojosari, Mojokerto<br>
        Hobby &nbsp;&nbsp;&nbsp;&nbsp; : tidur, makan </strong><br>
      </ol></td></tr>
      <tr>
      <td width="50"><div align="right">
      <div align="center"><img src="ozeck1.jpg" width="74" height="80" border="3"></div></td>
    </tr>
  </table>
</div>
</body>
</html>



Ini tampilan profile.htm
3. gallery.htm


<html>
<head>
<title> gallery </title>
</head>
<body><img src="ozeck1.jpg"width="145" height="150" border="3">
<img src="a.jpg"width="160" height="150" border="3">
<img src="13.jpg"width="149" height="150" border="3">
<img src="1.jpg"width="159" height="150" border="3">
<img src="3.jpg"width="148" height="150" border="3">
<img src="4.jpg"width="159" height="150" border="3">
<img src="5.jpg"width="159" height="150" border="3">
<img src="6.jpg"width="159" height="150" border="3">
<img src="7.jpg"width="159" height="150" border="3">
<img src="8.jpg"width="159" height="150" border="3">
</body>
</html>
Ini tampilan gallery.htm
4.bukutamu.htm


<html>
<head>
<title>Buku Tamu</title>
</head>

<body background="images/nn.jpg" font face="Arial" size="2">
<div align="left">
  <p align="center"><strong>Buku Tamu</strong></p>
    <table width="50%" border="0">
      <tr>
        <td align="left" valign="top">Nama</td>
        <td align="left" valign="top">:</td>
        <td align="left" valign="top"><label>
          <input type ="text" nama = "nama_pegawai" size = "20"
            maxleght = "20">
        </label></td>
      </tr>
      <tr>
        <td align="left" valign="top">Email</td>
        <td align="left" valign="top">:</td>
        <td align="left" valign="top"><label>
          <input type = "text" name = "hobby" size = "20"
            maxleght = "20">
        </label></td>
      </tr>
      <tr>
        <td align="left" valign="top">Pesan</td>
        <td align="left" valign="top">:</td>
        <td align="left" valign="top"><label>
          <textarea name="pesan" cols="35" rows="5" id="pesan_x"></textarea>
        </label></td>
      </tr>
      <tr>
        <td align="left" valign="top">&nbsp;</td>
        <td align="left" valign="top">&nbsp;</td>
        <td align="left" valign="top"><label>
          <input type="submit" name="Submit" value="Simpan" />
          <input type="submit" name="Submit2" value="Batal" />
        </label></td>
      </tr>
    </table>
  </form>
</div>
</body>
</html>

Ini tampilan bukutamu.htm
5. contact.htm

<html>
<head></head><title>contact</title><html>
<body background="white">
<font face="Arial" size="2">
  <div align="center">
    <p align="center"><strong>CONTACT</strong></p>
    <p align="left">Anda dapat menghubungi lewat email saya, <br>
    <a href="mailto:zakiinzaghi@yahoo.co.id">zakiinzaghi@yahoo.co.id </a>atau blog saya <a href="http://mochamadzaqi.blogspot.com/">http://mochamadzaqi.blogspot.com</a>   
    <p align="left"><strong>Form Email : </strong></p>
    <div align="left">
      <table width="100%" border="0">
        <tr>
          <td width="15%" valign="top">Email Anda </td>
          <td width="2%" valign="top">:</td>
          <td width="83%" valign="top" class="style5"><label>
            <input name="email_anda" type="text" id="email_anda" size="30">
          </label></td>
        </tr>
        <tr>
          <td width="15%" valign="top">Isi Pesan </td>
          <td width="2%" valign="top">:</td>
          <td valign="top" class="style5"><label>
            <textarea name="isi_pesan" cols="35" rows="5" id="isi_pesan"></textarea>
          </label></td>
        </tr>
        <tr>
          <td width="15%" valign="top">&nbsp;</td>
          <td width="2%" valign="top">&nbsp;</td>
          <td valign="top" class="style5"><label>
            <input name="kirim" type="submit" id="kirim" value="Kirim">
            <input name="batal" type="reset" id="batal" value="Batal">
          </label></td>
        </tr>
      </table>
    </div>
  </div>
</body>
</html>



Ini tampilan contact.htm


Untuk file lengkapnya di  
http://www.ziddu.com/download/12208233/tugas_frame_zaki.rar.html

Demikian tugas membuat frame yang saya buat
Sekian Terima Kasih 

Jumat, 15 Oktober 2010

tugas 2

TUGAS 2
MEMBUAT GARIS-GARIS PADA HTML

Pertama kita instal dulu web server lalu ketikkan skrip html pada notepad,dreamweaver,editplus, dan lain-lain. Terserah pakai editor yang anda pilih kemudian skrip anda simpan dengan ektensi di belakangnya .html atau .htm . Simpan skrip html anda pada web server yang tepatnya pada folder dengan nama htdocs agar bisa bisa dijalankan.
Ini skrip html untuk membuat garis-garis :
<html>
<head>
<title>Tugas 2</title>
<style type="text/css">
<!--
body {background-color: #FF0000;}
-->
</style></head>
<body>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><center><h3><font face="verdana">
<font color="#00FF00"> MOCHAMAD ZAQI
<br><font color="#00FF00">08.10802.00181
<br><font color="#00FF00"> 5 D sore
<br><font color="#00FF00">Tugas ke 2
<hr align="center" width="60" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="140" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="180" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="260" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="160" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="100" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="60" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="60" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="60" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="60" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="100" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="160" size="10" noshade="noshade" color="#000000" />
<hr align="center" width="260" size="10" noshade="noshade" color="#000000" />
</body>
</html>


Di bawah ini saya menggunakan editor lewat notepad
Dan di bawah ini saya menggunakan editor lewat dreamweaver
 Ini hasil dari tugas yang saya buat
 
Demikian terima kasih.

MOCHAMAD ZAQI
08.10802.00181
5D sore /Teknik Informatika

Senin, 11 Oktober 2010

tugas web 1



INSTALASI XAMPP 
Double Klik pada icon xampp-win32-1.7.1-installer
Pilih bahasa yang akan digunakan dalam aplikasi lalu klik OK
Akan muncul tampilan seperti ini lalu klik NEXT

Klik tombol BROWSE untuk memilih aplikasi xampp mau diinstal di direktori mana kalau sudah ditentukan xampp mau diinstal di direktori mana kemudian anda klik NEXT untuk berjalan ke tahap berikutnya


Centang pada bagian SERVICE SECTION yang  akan diinstal

Lalu klik INSTAL
Ini loading untuk INSTAL  tunggu hingga selesai
Klik finish



Klik OK
Klik YES untuk menuju ke XAMPP Control Panel Application
Ini tampilan Control Panel Application

Selamat anda telah SUKSES menginstal web server XAMPP