Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
27 views

Web Programming Using PHP

The document provides a summary of Module 1 of a course on Web Programming Using PHP. It includes 15 multiple choice questions about CSS, HTML, URLs, and the differences between static/dynamic/active web pages and client-side and server-side scripting. It also explains how to add CSS to HTML documents using internal, external, and inline styles, and how CSS can be used to style tables and create image galleries. Finally, it defines different types of CSS selectors like element, class, ID, and attribute selectors.

Uploaded by

Hari Murali
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
27 views

Web Programming Using PHP

The document provides a summary of Module 1 of a course on Web Programming Using PHP. It includes 15 multiple choice questions about CSS, HTML, URLs, and the differences between static/dynamic/active web pages and client-side and server-side scripting. It also explains how to add CSS to HTML documents using internal, external, and inline styles, and how CSS can be used to style tables and create image galleries. Finally, it defines different types of CSS selectors like element, class, ID, and attribute selectors.

Uploaded by

Hari Murali
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 13

WEB PROGRAMMING USING PHP

MODULE 1
MAJLIS ARTS AND SCIENCE COLLEGE, PURAMANNUR

DEPARTMENT OF COMPUTER SCIENCE

WEB PROGRAMMING USING PHP (5th Semester Online Study Material)

B.Sc Computer Science & BCA

(Questions and answers based on First Module)

1. CSS stands for ------

Ans: Cascading Style Sheet

2. ------HTML tag is used to define an internal style sheet.

Ans: <style>

3. The expansion of URL is -----

Ans: Uniform Resource Locator

4. HTML stands for------

Ans: Hypertext Markup language

5. The entire contents of the webpage is enclosed within ------tags.

Ans: <body>

6. The initial page present in the website is the -----page.

Ans: home page

7. How to add comments in CSS?

Ans:

CSS comment is placed inside<style> element and start with /* and end with */

8. Explain the properties of style sheet.

Ans:

• CSS stands for Cascading Style Sheets


• CSS describes how HTML elements are to be displayed on screen, paper, or in other
media
• CSS saves a lot of work. It can control the layout of multiple web pages all at once
• External style sheets are stored in CSS files

CSS Syntax

A CSS rule-set consists of a selector and a declaration block:

The selector points to the HTML element you want to style.

The declaration block contains one or more declarations separated by semicolons.

Each declaration includes a CSS property name and a value, separated by a colon.

Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded
by curly braces.

EXAMPLE:

p{
color: red;
text-align: center;
}

• p is a selector in CSS (it points to the HTML element you want to style: <p>).
• color is a property, and red is the property value
• text-align is a property, and center is the property value

A CSS style sheet is a collection of a number of style definitions, each style definition has two
main components

Selector: To select the element to which the CSS rule applies

Declaration: Specifies how the selected element should be styled.Multiple declarations are
seperated by colon(;)

The Declaration further comprises of two components:

Property: Specfies the feature of the element to be affected. Eg: font-family,color etc.

Value: The value for the given property.


• The property name and value are seperated by a colon (:).

9. What is a web browser?

Ans:

Web browser is a software application for accessing information on the WWW.

10. Differentiate static, active, dynamic web pages.

Ans:

Static web page

 Also known as flat or stationary web page.

 They are loaded on the client’s browser as exactly they are stored on the web server.

 Such web pages contain only static information.

 User can only read the information but can’t do any modification or interact with the
information.

Dynamic web page

 It shows different information at different point of time.

 It is possible to change a portion of a web page without loading the entire web page.

 It has been made possible using Ajax technology.

 Scripting language is used to create dynamic web pages.

Active web page

 An active web page is a page where the browser performs the logic instead of the server.

 Example: when you've got a page where you're showing share prices, then you want it
to update e.g. every 5 seconds.

11. Differentiate client side and server side scripting.

Ans:

Client scripting server scripting


1.Executed in the client side Executed in the web server

or web browser

2. Does not provide More security for the data

much security for the

data

3. Cannot be used to connect to the database

Connect the database

On the web server

4. Cannot access the file can access the file system

System that resides at

the web server

5. Response is faster response is slow

compared to server compared to client

side scripting side scripting

6. Languages used in: Ruby, PHP,ASP,etc

Javascript, VB Script, etc.

12. Explain how to add CSS to HTML document.

Ans:
Three Ways to Insert CSS

There are three ways of inserting a style sheet:

• External CSS
• Internal CSS
• Inline CSS

External CSS
External styles are defined within the <link> element, inside the <head> section of an HTML
page

Eg:
<html>
<head>
<link rel="stylesheet" href="mystyle.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

mystyle.css"
body {
background-color: lightblue;
}

h1 {
color: navy;
margin-left: 20px;
}

An external style sheet can be written in any text editor, and must be saved with a .css
extension.

The external .css file should not contain any HTML tags

Internal CSS

An internal style sheet may be used if one single HTML page has a unique style.
The internal style is defined inside the <style> element, inside the head section.

Eg:

<html>
<head>
<style type=”text/css”>
body {
background-color: linen;
}

h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Inline CSS

An inline style may be used to apply a unique style for a single element.

To use inline styles, add the style attribute to the relevant element. The style attribute can
contain any CSS property.

Example

Inline styles are defined within the "style" attribute of the relevant element:

<html>
<body>
<h1 style="color:blue;text-align:center;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>

</body>
</html>
13. Describe how to apply CSS in tables with example.

Ans:

CSS Table Properties


Width & height
The width and height of a table are defined by the width and height properties.
table {
width:100%;
height:70px;
}

border-collapse
The border-collapse property sets whether the table borders should be collapsed into a single
border
border-collapse: collapse;

text-align
The text-align property sets the horizontal alignment (like left, right, or center) of the content in
<th> or <td>.
th {
text-align: center;
}
padding

To control the space between the border and the content in a table, use the padding property on
<td> and <th> elements.

th{padding:45px;}

border

The border property is a shorthand property for:

• border-width
• border-style
• border-color
border: border-width border-style border-color;

border-width: Specifies the width of the border. Default value is "medium"

border-style : Specifies the style of the border. Default value is "none"

• dotted - Defines a dotted border


• dashed - Defines a dashed border
• solid - Defines a solid border
• double - Defines a double border
• groove - Defines a 3D grooved border. The effect depends on the border-color value
• ridge - Defines a 3D ridged border. The effect depends on the border-color value
• inset - Defines a 3D inset border. The effect depends on the border-color value
• outset - Defines a 3D outset border. The effect depends on the border-color value
• none - Defines no border
•

border-color: Specifies the color of the border. Default value is the color of the text

eg:
<html>
<head>
<style type=”text/css”>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>

<h2>Add a border to a table:</h2>

<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
<tr>
<td>Lois</td>
<td>Griffin</td>
</tr>
</table>

</body>
</html>

14. How is CSS used to create an image gallery? Explain with example.

Ans:

Set themargin property to indicate space between image boxes.

Padding indicates to the space between image and text.

Text-align indicate textbox in your preferred position.

Eg:

<html>
<head>
<style type=”text/css”>

.gallery {
margin: 5px;
border: 1px solid #ccc;
float: left;
width: 180px;
}

div.gallery:hover

{
border: 1px solid #777;
}

div.gallery img {
width: 100%;
height: auto;
}

div.desc {
padding: 15px;
text-align: center;
}
</style>
</head>
<body>

<div class="gallery">
<a target="_blank" href="img_5terre.jpg">
<img src="img_5terre.jpg" alt="Cinque Terre" width="600" height="400">
</a>
<div class="desc">Add a description of the image here</div>
</div>

<div class="gallery">
<a target="_blank" href="img_forest.jpg">
<img src="img_forest.jpg" alt="Forest" width="600" height="400">
</a>
<div class="desc">Add a description of the image here</div>
</div>

<div class="gallery">
<a target="_blank" href="img_lights.jpg">
<img src="img_lights.jpg" alt="Northern Lights" width="600" height="400">
</a>
<div class="desc">Add a description of the image here</div>
</div>

<div class="gallery">
<a target="_blank" href="img_mountains.jpg">
<img src="img_mountains.jpg" alt="Mountains" width="600" height="400">
</a>
<div class="desc">Add a description of the image here</div>
</div>

</body>
</html>

15. Explain CSS selectors.

Ans:

CSS selectors are used to "find" (or select) the HTML elements you want to style.

Five categories:

• Simple selectors (select elements based on name, id, class)


• Combinator selectors (select elements based on a specific relationship between them)
• Pseudo-class selectors (select elements based on a certain state)
• Pseudo-elements selectors (select and style a part of an element)
• Attribute selectors (select elements based on an attribute or attribute value)

The CSS element Selector

The element selector selects HTML elements based on the element name.

p{
text-align: center;
color: red;
}

The CSS id Selector


The id selector uses the id attribute of an HTML element to select a specific element.
The id of an element is unique within a page, so the id selector is used to select one unique
element!
To select an element with a specific id, write a hash (#) character, followed by the id of the
element.

Eg:

#para1
{
text-align: center;
color: red;
}
<p id=”para 1”>welcome</p>
The CSS class Selector
The class selector selects HTML elements with a specific class attribute.
To select elements with a specific class, write a period (.) character, followed by the class name.

Eg:

.c
{
text-align: center;
color: red;
}
<p class="c ">this paragraph refers to two classes. </p>
The CSS Universal Selector

The universal selector (*) selects all HTML elements on the page.

*{
text-align: center;
color: blue;
}

The CSS Grouping Selector

The grouping selector selects all the HTML elements with the same style definitions.

h1 {
text-align: center;
color: red;
}

h2 {
text-align: center;
color: red;
}

p{
text-align: center;
color: red;
}

It will be better to group the selectors, to minimize the code.

To group selectors, separate each selector with a comma.

Eg:

h1, h2, p {
text-align: center;
color: red;
}

You might also like