0% found this document useful (0 votes)
3 views

Css Practice Question

The document contains a series of questions and answers related to CSS coding practices, including inline, internal, and external CSS examples. It provides specific code snippets for styling HTML elements such as headings, paragraphs, and body backgrounds. The document serves as a guide for implementing various CSS styles in web design.

Uploaded by

uddaybhadana87
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views

Css Practice Question

The document contains a series of questions and answers related to CSS coding practices, including inline, internal, and external CSS examples. It provides specific code snippets for styling HTML elements such as headings, paragraphs, and body backgrounds. The document serves as a guide for implementing various CSS styles in web design.

Uploaded by

uddaybhadana87
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

CSS_PRACTICE QUESTION

Q1. Write an inline CSS code to set the font of the heading element as 'Arial' and the text color to red.
ANS. <HTML>
<BODY>
<H1 STYLE=FONT-FAMILY:ARIAL; COLOR:RED;> HEADING 1</H1>
</BODY>
</HTML>
Q2. Write the equivalent inline CSS for the following : <body bgcolor="blue">
ANS . <HTML>
<BODY STYLE=BACKGROUND-COLOR:BLUE;>
</BODY>
</HTML>
Q3. Write the equivalent internal CSS for the following : <p style="color:blue;">Example</p>
ANS . <HTML>
<HEAD>
<STYLE>
P{COLOR:BLUE;}
</STYLE>
</HEAD>
<BODY>
<P>EXAMPLE</P>
</BODY>
</HTML>
Q4. a. Write an external CSS code snippet to set the colour of the webpage as pink.
BODY{BACKGROUND-COLOR:PINK;}
Note : save above coding with the file name color.css in notepad.
<HTML>
<HEAD>
<link rel=stylesheet href=”color.css”>
</HEAD>
<BODY>
<H1> OPERATING SYSTEM</H1>
<P> it acts as an interface between the software and computer hardware</P>
</BODY>
</HTML>
b. Write an inline CSS code to set the Font size for a paragraph as 15.
ANS. <P STYLE=FONT-SIZE:15;>THIS IS A PARAGRAPH</P>

Q5. Write a CSS code for the following specifications: Background color should be pink. For the paragraph: Border
style should be dashed and red in color.
ANS . <HTML>
<HEAD>
<STYLE>
BODY{BACKGROUND-COLOR:PINK;}
P{BORDER-STYLE:DASHED;BORDER-COLOR:RED;}
</STYLE>
</HEAD>
<BODY>
<P>EXAMPLE</P>
</BODY>
</HTML>

Q6. Sophia, a web designer working for a creative agency, wants to apply consistent styling to all <p> (paragraph)
elements on a webpage. However, she's facing challenges achieving this with regular HTML code. Provide
guidance to Sophia on how she can implement the following styles for all <p> elements. across the webpage:
Text color: Green
Background color: Light Pink
Border: 1px solid Purple

ANS . <HTML>
<HEAD>
<STYLE>
BODY{BACKGROUND-COLOR:LIGHT PINK;}
P{BORDER-STYLE:SOLID;BORDER-COLOR:RED;BORDER-WIDTH:1px;}
</STYLE>
</HEAD>
<BODY>
<P>THIS IS PARAGRAPH SHOWN IN SOLID BLUE COLOR</P>
</BODY>
</HTML>

Q7. Form a CSS code within the <head>...</head> for the following specification:
Background colour: red.
For the paragraph: font family is dotum and colour of the text is yellow.
Heading should be in blue colour.
ANS . <HTML>
<HEAD>
<STYLE>
BODY{BACKGROUND-COLOR:RED;}
P{COLOR:YELLOW;FONT-FAMILY:DOTUM;}
H1{COLOR:BLUE;}
</STYLE>
</HEAD>
<BODY>
<P>THIS IS PARAGRAPH SHOWN IN SOLID BLUE COLOR</P>
</BODY>
</HTML>
Q8. Write the equivalent CSS code to set the following styles for a web page :
Second level heading properties should be as follows :
• Text color should be red.
• Left margin should be 25 px
ANS . <HTML>
<HEAD>
<STYLE>
H2{COLOR:RED; MARGIN-LEFT:25Px;}
</STYLE>
</HEAD>
<BODY>
<H2>THIS IS HEADING SHOWN IN RED COLOR</H2>
</BODY>
</HTML>
Q9. (i) Write a inline CSS code to display the first level heading text as “my school” in green color and center-aligned.
(ii) Write the inline CSS code to display the following paragraph below the above mention heading
This is my school
I study in class 12
The properties of the paragraph contains should be as follows:
Text colour should be yellow
Font size should be 25 px
Font style should be bold
ANS (i) <HTML>
<BODY>
<H1 STYLE=COLOR:GREEN; TEXT-ALIGN:CENTER;>MY SCHOOL</H1>
</BODY>
</HTML>

(ii) <HTML>
<BODY>
<P STYLE=COLOR:YELLOW; FONT-SIZE:25px; FONT WEIGHT:BOLD;>THIS IS MY
SCHOOL<BR>
I STUDY IN CLASS 12</P>
</BODY>
</HTML>
Q10. Write the equivalent inline CSS for the following HTML tag.
(i) <BODY BGCOLOR=”GREEN”>
(ii) <IMG SRC=>”me.jpg” STYLE=”HEIGHT=20 WIDTH=30>

ANS (i) <HTML>


<BODY STYLE=BACKGROUND-COLOR:GREEN;>
</BODY>
</HTML>
(ii) <HTML>
<BODY>
<IMG SRC=”me.jpg” STYLE=”HEIGHT:20px; WIDTH:30px;”>
</BODY>
</HTML>

You might also like