1)
CSS file
body {
font-family:calibri;
}
table {
border-collapse:collapse;
border-style: solid;
border-color: red;
background-color: #FDD017;
}
td.yellow2 {
/*background-color: yellow;*/
border-width: 2px;
border-style: solid;
border-color: red;
font-size: 0.8em;
text-align:left;
}
td.yellow {
background-color: #FFFFCC;
border-width: 2px;
border-style: solid;
border-color: red;
}
th.border {
background-color: #FFFFCC;
border-width: 2px;
border-style: solid;
border-color: red;
}
HTML File
<html>
<head>
<style type="text/css"> @import url("style.css")
</style>
</head>
<body>
<table border="2">
<th colspan="4"><center> Search Products </center></th>
<tr>
<td class="yellow2"><b> Search For: </b></td>
<td class="yellow"><input type="text"></input></td>
<td class="yellow2"><b>Max Price: </b></td>
<td class="yellow"><input type="numbers" size = "10"></input></td>
</tr>
<tr>
<td class="yellow2"><b> Search Type: </b></td>
<td class="yellow"><select name="type"> <option value="All Words"> All Words </select></td>
<td class="yellow2"><b> In Category: </b></td>
<td class="yellow"><select name="category"> <option value="All Categories"> All Categories </select></td>
</tr>
<th class="border" colspan="4">
<center><input type="button" value="SEARCH NOW"></center>
</th>
</table>
</body>
</html>
2)
CSS File
body {
background-image:url("UCSIULogo.jpg");
background-repeat:no-repeat;
background-size:10%;
background-attachment:scroll;
}
h1{
color:red;
font-size:25;
font-family: calibri;
text-indent:130px;
}
h2 {
color:black;
font-size:18;
font-family: calibri;
text-indent:130px;
}
table.A {
font-family:calibri;
border-collapse:collapse;
border-width:2px;
border-color: black;
border-style: dotted;
color:blue;
margin-left:130px;
width:480px;
padding-left: 10px;
}
hr {
margin-left: 130px;
width:550px;
size:5px;
}
div.image {
content:url("ucsicampuskl.jpg");
width:40%;
padding-left:130px;
}
HTML File
<html>
<head>
<style type="text/css"> @import url("Tutorial8.2.css")
</style>
</head>
<body>
<h1>School of Information Technology</h1>
<h2>Faculty of Business and Information Science</h2>
<table class="A" border="1">
<tr>
<td style="blue">Contact: 999-123 4567 (Betty)<br>
Email: betty@ucsiuniversity.edu.my
</td>
</tr>
</table>
<hr></hr>
<div class="image"> </div>
</body>
</html>
No comments:
Post a Comment