Assignment: Cascading Style Sheets (CSS) | Computer Application: Class 10 PDF Download

Multiple Choice Questions

Q1. The acronym CSS stands for what ?
(a) Carrot System Style
(b) Correlated Styling System
(c) Cascading Style Sheets
(d) Canvas Styling System

Ans. (c) Cascading Style Sheets
CSS stands for Cascading Style Sheets.

Q2. What property would you use to create space between the element's border and inner content ?
(a) padding
(b) spacing
(c) margin
(d) border

Ans. (a) padding
Padding defines the inner distance between the border and the content of the element.

Q3. To reference a style sheet across multiple HTML pages, how would you define your CSS ?
(a) Inline Style
(b) Internal Style Sheet
(c) External Style Sheet
(d) CSS is meant for only one page

Ans. (c) External Style Sheet
To reference a style sheet across multiple HTML pages, we define our CSS as an external style sheet.

Q4. What is the correct CSS syntax for making all the <span> elements bold ?
(a) span {text-size:bold}
(b) span {font-weight:bold}
(c) <span style="font-size:bold">
(d) <span style="text-size:bold">

Ans. (b) span {font-weight:bold}
The property font-weight specifies the boldness or heaviness for a font. In the given code, the content of span is set to bold.

Q5. What property is used to change the text color of an element ?
(a) fontcolor:
(b) textcolor:
(c) color:
(d) font-color:

Ans. (c) color:
color property is used to change the text color of an element. For example:
p {color : red ;}

Q6. Which is the correct CSS syntax ?
(a) {p:color=black(p}
(b) p {color: black;}
(c) {p;color:black}
(d) p:color=black

Ans. (b) p {color: black;}

The correct CSS syntax is :

selector {color : value ;}

The option p {color: black;} follows correct CSS syntax.

Q7. Which HTML attribute is used to define inline CSS styles ?
(a) css
(b) id
(c) type
(d) style

Ans. (d) style
STYLE attribute is used to define inline CSS styles. For example,

<H3 STYLE = "FONT-FAMILY = ARIAL">

Q8. How do you make each word in a text start with a capital letter ?
(a) text-transform:capitalize
(b) text-transform:uppercase
(c) You can't do that with CSS
(d) text:capitalize

Ans. (a) text-transform:capitalize
When the value of text-transform is set to capitalize, it will capitalize the first letter of each word.

Q9. Which CSS property controls the text size ?
(a) font-height
(b) text-size
(c) font-size
(d) text-style

Ans. (c) font-size
font-size property is used to set the size of a font.

Q10. How do you insert padding so that it is :
10 pixels at the top
15 pixels at the bottom
5 pixels at the right
10 pixels to the left
(a) padding:10px 15px 5px 10px ;
(b) padding:15px 5px 10px 10px ;
(c) padding:10px 5px 10px 15px ;
(d) padding:10px 5px 15px 10px ;

Ans. (d) padding:10px 5px 15px 10px ;

The order of padding values is top, right, bottom and left. Thus, to insert the given padding, we write the definition as follows:

padding:10px 5px 15px 10px ;

Theoretical Questions

Q1. Use the CSS ............... property to configure the cellpadding of a table.

Ans. table   { padding : 50px 20px 20px 20px ; }

Q2. What is the utility of dynamic websites ?

Ans. The utility of dynamic websites are as follows:

1. Dynamic websites allow easy content updates.
2. They tailor content based on user preferences.
3. They enable feedback forms, comment sections, and social media integration.
4. They can fetch and display real-time data from databases or APIs enabling live updates like news feeds, stock market information, weather updates, etc.
5. They support online transactions and inventory management.
6. They handle large amounts of content and user traffic.
7. They streamline processes and save time.

Q3. What are some features of dynamic websites ?

Ans. Some features of dynamic websites are as follows:

1. User registration and authentication can be done.
2. Content management system (CMS) provides for easy content updates.
3. Search functionality to find specific content.
4. Database integration for dynamic content generation.
5. Interactive forms for user engagement.
6. E-commerce capabilities for online transactions.
7. Social media integration for sharing and interaction.
8. Personalization based on user preferences.
9. Dynamic content delivery for customized user experiences.
10. Analytics and tracking to gather data for analysis and optimization.

Q4. What do you understand by Stylesheets? How are these useful ?

Ans. A style sheet is a file containing formatting guidelines that define the overall look of a document.
Style sheets are useful in the following ways:

1. It helps to separate structure and presentation. The HTML file can include structure tags and style sheet takes care of the presentation of content.
2. Web pages download much faster.
3. Developers have to type less code, and the web pages are shorter and neater.
4. The look of the site is kept consistent throughout all the pages that work off the same style sheet.
5. Updating design and general site maintenance are made much easier.
6. Errors caused by editing multiple HTML pages occur less often.

Q5. What is CSS style rule? How do you define it ?

Ans. A CSS rule is a single statement in a style sheet that identifies what should be styled (the selector) and how those styles should be applied (the declaration).

We define a rule by writing the selector tag without angle brackets. The properties and their values are written in the following syntax:

selector { propertyname : value ; propertyname : value ; ...}

For example, if we want <H3 tag to have font face Arial and red color then we define the style rule as follows:

h3 { font-family : Arial ; color : red ; }

Q6. What are three ways of creating style rules? Give examples of each.

Ans. The three ways of creating style rules are as follows:

1. Inline — Styles are embedded right within the HTML code they affect. For example,

<h3 style = "font-family = Arial ; color = red ">

2. Internal — Styles are placed within the header information of the web page and then affect all the corresponding tags on the page. For example,

<HEAD>

<STYLE TYPE = "TEXT/CSS">

h3 { font-family : Arial ; color : red ; }

</STYLE>

</HEAD>

3. External — Styles are coded in a separate document, which is then referenced from within the header of the actual web page. For example, let there be a CSS file named sample.css :

h3 { font-family : Arial ; color : red ; }

p { font-family : Times New Roman ; color : blue ; }

...and so on...

To link sample.css file to an HTML document, we use the <link tag in the following manner:

<HEAD>

<LINK REL = "STYLE SHEET" TYPE = "TEXT/CSS" HREF = "SAMPLE.CSS">

</HEAD>

Q7. What is the Cascading order of different style types ?

Ans. The cascading order of different style types from higher precedence to lower precedence is :

1. Inline
2. Internal
3. External

Q8. Where do you place the code to associate a Web page with an external style sheet ?

Ans. To associate a Web page with an external style sheet, we place the code in the head tag in the following manner :

<HEAD>

<LINK REL = "STYLE SHEET" TYPE = "TEXT/CSS" HREF = "SAMPLE.CSS">

</HEAD>

where, sample.css is the name of the CSS file.