Islamic University of Gaza ‫زة‬ ‫ا‬ ‫ا‬

Faculty of Information Technology ‫وو ا و ت‬

Course: Web Programming 1 1‫وب‬ ‫ ر‬:‫ا ق‬
Lecturer: Dr. Wael Al Sarraj ‫ل ا راج‬$‫ وا‬.‫ د‬:‫ا ! ر‬
Midterm Exam - Monday 06/11/2017 (60 minutes)

: ‫ار م ا‬ :‫ة‬/‫ا م ا ط ب‬

Q1 /10 Q2/10 Q3/10 Q4/10 Total mark

Q1) Select the right answer.

1 The ________ allows people and companies to use 2 ________ is used to specify the presentation, or styling, of elements on a
computer-processing power via internet web page (e.g., fonts, spacing, sizes, colors, positioning).
everywhere in the world and at any time.
A World Community Grid A HyperText Markup Language (HTML5)
B Cloud computing B Extendable Markup Language (XML)
C Internet TV C JavaScript
D GPS D Cascading Style Sheets (CSS)
3 10 The protocol for communicating over the 4 URL is an acronym for which of the following?
ARPANET became known as ________.
A IP (the Internet Protocol) A Uniform Resource Locator
B HTTP (Hyper Text Transfer Protocol) B Uniform Record Locator
C TCP (Transmission Control Protocol) C Universal Resource Location
D All the above D Uniform Resource Location
5 An Internet ________ maintains a database of 6 The two most common HTTP request types (also known as request
hostnames and their corresponding IP addresses methods) are ________ and ________.
and performs the translations automatically.
A TCP/IP A query, post
B Web Server B get, post
C Domain Name System (DNS) C retrieve, send
D Uniform Resource Identifier (URI) D retrieve, post
7 Web-based applications are often multitier 8 Web technologies standardized by the W3C are called ________.
applications, sometimes referred to as ________
applications.
A n-tier A Rules
B Single-tier B Standards
C data-tier C Regulations
D m-tier D Recommendations
9 Web 2.0 embraces a(n) ________—a design that 10 A ________ is consisted of a group of fields.
encourages user interaction and community
contributions.
A Architecture of web A database
B Architecture of trust B record
C Architecture of participation C character set
D None of the above D field

1 2 3 4 5 6 7 8 9 10 Mark
B D C A C B A D C B

1
Q2) HTML5:

WRITE THE HTML5 TAGS/CODE:

1 <h1>Feedback Form</h1>

2 <p><label>Name:
<input name = "name" type = "text" size = "25">
</label></p>
3 <p><label>E-mail Address:
<input name = "email" type = "password" size = "25">
</label></p>
4 <label>Site design
<input name = "thingsliked" type = "checkbox"
value = "Design"></label>
5 <label>Search engine
<input name = "howtosite" type = "radio"
value = "search engine" checked></label>
6 <select name = "rating">
<option selected>Amazing</option>
<option>10</option>
</select>
7 <input type = "submit" value = "Submit">
<input type = "reset" value = "Clear">
8 <tbody>
<tr>
<th>star</th>
<td>2</td>
<td>dddd</td>
</tr>

2
Q3) CSS3:

Write CSS3 code:

1 CREATE STYLE FOR THE DROP MENU
<style type = "text/css">
body { font-family: arial, sans-serif }
nav { font-weight: bold;
color: white;
border: 2px solid royalblue;
text-align: center;
width: 10em;
background-color: royalblue; }
nav ul { display: none;
list-style: none;
margin: 0;
padding: 0; }
</style> ----------------------------------------
<nav>Menu <ul>
<li><a href = "#">Home</a></li>
<li><a href = "#">News</a></li>
<li><a href = "#">Articles</a></li>
<li><a href = "#">Blog</a></li>
<li><a href = "#">Contact</a></li> </ul>
2 CREATE A STYLE FOR THE ELEMENTS IN THE DROP MENU
nav:hover ul { display: block }
nav ul li { border-top: 2px solid royalblue;
background-color: white;
width: 10em;
color: black; }
3 CREATE A STYLE FOR THE HOOVER ELEMENT
nav ul li:hover { background-color: powderblue; }
a { text-decoration: none; }
4 MAKE A STYLE OF BACKGROUND IMAGE STAR.JPG WITH REFLECTION
<style type = "text/css">
img { margin: 10px; }
img.below
{ webkit-box-reflect: below 5px
-webkit-gradient(
linear, left top, left bottom,
from(transparent), to(white)); }
img.right
{
mg.right
{ -webkit-box-reflect: right 5px
-webkit-gradient(
linear, right top, left top,
from(transparent), to(white));
}
</style>

3
Q4) HTML5+CSS3:

Write only the requested HTML5 and CSS Code:

1 Essential HTML5 code only

<style type = "text/css">

2 Div {
border: 3px solid navy;
padding: 5px 20px;
background: lightcyan;
width: 200px;
text-align: center;
border-radius: 15px; /* adding rounded corners */
margin-bottom: 20px; }
#round2 {
border: 3px solid navy;
padding: 5px 20px;
background: lightcyan;
width: 200px;
text-align: center;
border-radius: 50px; /* increasing border-radius */ }
</style>
<style type = "text/css">
3 h1
{
text-shadow: -4px 4px 6px dimgrey; /* add shadow */
font-size: 400%; /* increasing the font size */
</style>
.skew .textbox { @-keyframes skew
4 margin-left: 75px; {
background: lightgreen; from { -webkit-transform: skewX(0deg); }
height: 100px; 25% { -webkit-transform: skewX(45deg); }
width: 200px; 50% { -webkit-transform: skewX(0); }
padding: 25px 0; 75% { -webkit-transform: skewX(-45deg); }
text-align: center; to { -webkit-transform: skewX(0); }
font-size: 250%;
border: 3px solid DarkGreen;
border-radius: 15px;
-webkit-animation: skew 3s infinite linear;
-moz-animation: skew 3s infinite linear;
animation: skew 3s infinite linear; }