Belajar HTML pert 5-7

 Pertemuan 5.

<html>
<head>
    <title> pert 5 </title>
</head>
<body>
    <table colspan=3 border="0" width="100%" height="100%">
        <tr height="100%" width="100%">
            <td width="20%">
            </td>

            <td width="60%">
               
                <table border="0" colspan = 2 width="100%" height="100%">
                    <tr>
                        <td colspan=2 height=100>
                            <img src="file:///C:/Users/ASUS/Documents/semester%205/3.%20HTML/pert5/nyahoo%20!.jpg" width="220" height="110" alt="nyahoo! logo"  />
                            <center> <hr size="1" color = "gray" width="50%"> </center>
                        </td>
                    </tr>
           
                    <tr>
                        <td width="30%"> <p align=right> name </p> </td>
                        <td width="70%">
                            <input type="text" name="" placeholder="first name">
                            <input type="text" name="" placeholder="last name">
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> gender </p> </td>
                        <td>
                            <select>
                                <option value = "select one"> select one
                                <option value = "male"> male
                                <option value = "female"> female
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> birthday </p> </td>
                        <td>
                            <select>
                                <option value = "select month"> select month
                                <option value = "month1"> january
                                <option value = "month2"> february
                                <option value = "month3"> march
                                <option value = "month4"> april
                                <option value = "month5"> may
                                <option value = "month6"> june
                                <option value = "month7"> july
                                <option value = "month8"> august
                                <option value = "month9"> september
                                <option value = "month10"> october
                                <option value = "month11"> november
                                <option value = "month12"> december
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> country </p> </td>
                        <td>
                            <select style="width:290">
                                <option value = "select month"> select month
                                <option value = "country1"> a
                                <option value = "country2"> b
                                <option value = "country3"> c
                                <option value = "country4"> d
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> language </p> </td>
                        <td>
                            <select>
                                <option value = "select month"> select month
                                <option value = "language1"> a
                                <option value = "language2"> b
                                <option value = "language3"> c
                                <option value = "language4"> d
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td colspan=2 align=center height=50" style= "color:purple">
                            Select an ID and password
                            <center> <hr size="1" color = "gray" width="60%"> </center>
                        <td>
                    </tr>

                    <tr>
                        <td> <p align=right> Yahoo ID and email </p> </td>
                        <td>
                            <input type="text" name="email">
                            @
                            <select>
                                <option value = "mail1"> yahoo.com
                                <option value = "mail2"> ymail.com
                                <option value = "mail3"> rocketmail.com
                            </select>
                            <input type="button" name="check" value="check">
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> Password </p> </td>
                        <td>
                            <input type="text" name="password" style="width:240">
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> re-type Password </p> </td>
                        <td>
                            <input type="text" name="retypepassword" style="width:240">
                        </td>
                    </tr>

                    <tr>
                        <td colspan=2 align=center height=50 style= "color:purple">
                            In case you forget your ID or password
                            <center> <hr size="1" color = "gray" width="60%"> </center>
                        <td>
                    </tr>

                    <tr>
                        <td> <p align=right> Alternate email </p> </td>
                        <td>
                            <input type="text" name="alternate" style="width:290">
                        </td>
                    </tr>
       
                    <tr>
                        <td> <p align=right> secret question 1 </p> </td>
                        <td>
                            <select style="width:290">
                                <option value = "question1"> abc ?
                                <option value = "question2"> abc ?
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> your answer </p> </td>
                        <td>
                            <input type="text" name="answer1" style="width:290">
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> secret question 2 </p> </td>
                        <td>
                            <select style="width:290">
                                <option value = "question1"> abc ?
                                <option value = "question2"> abc ?
                            </select>
                        </td>
                    </tr>

                    <tr>
                        <td> <p align=right> your answer </p> </td>
                        <td>
                            <input type="text" name="answer2" style="width:290">
                        </td>
                    </tr>
                </table>
            </td>

            <td width="20%">
            </td>
        </tr>
    </table>
   
</body>

=============================================================
Pertemuan 6.

<html>
<head>
    <title> awal </title>
</head>

    <frameset cols="25%,75%">
    <frame src="1b. bahan1.html" />
    <frame src="1c. bahan2.html" />
        <noframes>
        <body>
            maaf, rowser tidak mendukung frame
        </body>
        </noframes>
    </frameset>

</html>

=============================================================
Pertemuan 7.

<html>
<head>
    <title> Pertemuan 7 </title>
</head>
<body>
    <table border="1" width= 980px  height=500px>
        <tr  height=70px>
            <td>
                <table width=100%>
                    <tr>
                        <td>
                            <img src="logo.jpeg" height=70px>
                        </td>
                        <td align=right>
                            <h1 align=right valign=top>My Online Shop </h1>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr >
            <td>
                <table width= 100% height=20px>
                    <tr bgcolor="#8ADFF2" height=100%>
                        <td> <a href=""><b> Home >> </b> </a> </td>
                        <td> <a href=""><b> Products >> </b> </a> </td>
                        <td> <a href=""><b> Cart >> </b> </a> </td>
                        <td> <a href=""><b> Contact us >> </b> </a> </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr height=600px>
            <td>
                <table border="1" width=1000 height=650 align=center>
                    <tr>
                        <td width=180px height=500 bgcolor="#E6F9FC" valign=top>
                            <table width=150px >
                                <tr>
                                    <td  bgcolor="#08089C" style="color:white"> Deal of The Day </td>
                                </tr>
                                <tr>
                                    <td> Sorry but we have no deals today </td>
                                </tr>
                                <tr>
                                    <td> <hr width=150px size=2> </td>
                                </tr>
                                <tr>
                                    <td bgcolor="#11BA27" style="color:white"> New Products </td>
                                <tr>
                                <tr>
                                    <td> Sorry but we have no new products today </td>
                                </tr>
                                <tr>
                                    <td> <hr width=150px size=2> </td>
                                </tr>
                            </table>
                        </td>
                        <td width=640px height=400 valign=top>
                            <p> <font size=18>WELCOME</font> to my online shop </p>
                            <br/>
                            <p> We offer you a series of unique products from around the world with affordable prices.<br/> Below we listed our top 10 best seller products</p>
                            <table>
                                <tr>
                                    <td>
                                        <a href="" style="text-decoration:none"> <img src="product.jpg" height=70px> </a> <br/>
                                        <a href="" style="text-decoration:none"><b> produk 1</b> </a>
                                    </td>
                                    <td>
                                        <a href="" style="text-decoration:none"> <img src="product.jpg" height=70px> </a> <br/>
                                        <a href="" style="text-decoration:none"><b> produk 2</b> </a>
                                    </td>
                                    <td>
                                        <a href="" style="text-decoration:none"> <img src="product.jpg" height=70px> </a> <br/>
                                        <a href="" style="text-decoration:none"><b> produk 3</b> </a>
                                    </td>
                                    <td>
                                        <a href="" style="text-decoration:none"> <img src="product.jpg" height=70px> </a> <br/>
                                        <a href="" style="text-decoration:none"><b> produk 4</b> </a>
                                    </td>
                                        <td> <a href="" style="text-decoration:none"> <img src="product.jpg" height=70px> </a> <br/>
                                        <a href="" style="text-decoration:none"><b> produk 5</b> </a>
                                    </td>
                                </tr>
                                <tr>
                                    <td> <img src="product.jpg" height=70px> <br/> <a href="" style="text-decoration:none"><b> produk 6</b> </a> </td>
                                    <td> <img src="product.jpg" height=70px> <br/> <a href="" style="text-decoration:none"><b> produk 7</b> </a> </td>
                                    <td> <img src="product.jpg" height=70px> <br/> <a href="" style="text-decoration:none"><b> produk 8</b> </a> </td>
                                    <td> <img src="product.jpg" height=70px> <br/> <a href="" style="text-decoration:none"><b> produk 9</b> </a> </td>
                                    <td> <img src="product.jpg" height=70px> <br/> <a href="" style="text-decoration:none"><b> produk 10</b> </a> </td>
                                </tr>
                            </table>
                            <p> For more information, please contact us </p>
                        </td>
                        <td width=160px height=400 bgcolor="#E6F9FC" valign=top>
                            <table>
                                <tr>
                                    <td> also visit our pages on : </td>
                                </tr>
                                <tr>
                                    <td>  <a href="" style="text-decoration:none"> <img src="facebook.jpeg" height=50px> </a>
                                </tr>
                                <tr>
                                    <td> <a href="" style="text-decoration:none"> <img src="twitter.jpeg" height=50px> </a>
                                </tr>
                                <tr>
                                    <td> <a href="" style="text-decoration:none"> <img src="google_plus.jpeg" height=50px> </a>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr height=10px>
            <td bgcolor="#8DF29A" align=center> Copyright @ 2012 </td>
        </tr>
    </table>
</body>
</html>

No comments:

Post a Comment