NIELIT QUESTION PAPER
A/O LEVEL (A2-R5)
JULY 2021
WEB DESIGNING AND PUBLISHING SOLUTIONS
A2-R5 : WEB DESIGNING AND PUBLISHING
Note:-change in the examination pattern of o/a/b level course. So, there will be only MCQ in theory paper not subjective question.
PART ONE
(Answer all the questions)
1. Each question below gives a multiple
choice of answers. Choose the most
appropriate one and enter in the “OMR”
answer sheet supplied with the question
paper, following instructions therein.
1.1 Markup tags tell the web browser
__________.
(A) How to organize the page
(B) How to display the page
(C) How to display message box on page
(D) None of these
Answer (c) markup tags tell the web browser.
Example - html markup tag -head,body,title etc tags.
1.2 __________ attribute of text box control
allow to limit the maximum character.
(A) size
(B) len
(C) maxlength
(D) all of the above
Answer (c) maxlength attribute of text box control allow to limit the maximum character.
1.3 Web pages start with __________ tag.
(A) <Body>
(B) <Title>
(C) <HTML>
(D) <Form>
1.4 The attribute, which define the
relationship between current document
and HREF’ed URL is :
(A) REL
(B) URL
(C) REV
(D) all of these
Answer A REL is the right answer.
There are mainly two attributes like, REL and REV which define the nature of relationship between the documents and the links.
REL are used between current documents and linked sources.
REV is used between linked sources and current documents.
1.5 Correct HTML to left align the content
inside a table cell is :
(A) <tdleft>
(B) <td raligh = “left” >
(C) <td align = “left”>
(D) <td leftalign>
Answer (c) is the correct answer because we right left in double invented comma and should be mention td align.
1.6 Meta tag appear in ___________.
(A) <HEAD>
(B) <TITLE>
(C) <BODY>
(D) <FORM>
Answer (a) The <meta> tag defines metadata about an HTML document. <meta> tags always go inside the <head> element, and are typically used to specify character set, page description, keywords, author of the document, and viewport settings.
1.7 What is the full form of HTML ?
(A) Hyphenation text markup language
(B) Hyper text markup language
(C) Hyper text marking language
(D) Hyphenation test marking language
Answer (b) Hyper text markup language
1.8 <INPUT> is __________.
(A) format tag
(B) empty tag
(C) both (A) and (B)
(D) none of the above
Answer (b) The input element is empty. It contains attributes only. There is no need of an end tag in HTML.
Example <input type="text" id="lname" name="lname">
1.9 The map definition file is generally storedi in:
(A) CGI-BIN
(B) RECYCLE-BIN
(C) BIN
(D) All of the above
Answer (A) CGI - BIN is a folder used for scripts that interact with a web browser to provide functionality for a web page or website, Common Gateway Interface (CGI) for scripts in web design. to use Since scripts are sent from the server to the web browser, CGI - BIN is often referred to as a CGI - BIN. is referenced in the URL.
1.10 The text inside the <TEXT AREA> tag
works like :
(A) <P> formatted text
(B) <T> formatted text
(C) <PRE> formatted text
(D) none of these.
Answer (c) <PRE> formatted text
4. Each statement below has a blank space to fit one of the word(s) or phrase(s) in the list
below. Choose the most appropriate option, enter your choice in the “OMR” answer
sheet supplied with the question paper, following instructions therein.
A. <PRE> formatted text
B. <LINK>
C. FILTERS
D. Brightness
E. RESET
F. HEAD tag
G. #
H. HTTP
I. Header
J. <CAPTION>
K. DTD
L. <t>
M. CSS list
4.1 The body tag usually used after _____
F HEAD tag _____.
4.2 The tag used to create a hypertext relationship between current document and another URL
is ____ B. <LINK>______.
4.3 The text inside the <TEXT AREA> tag works like _____A. <PRE> formatted text _____.
4.4 Win 10 Brightness Slider is a _____D. Brightness _____ tool.
4.5 The tag which allows you to rest other HTML tags within the description is __J. <CAPTION> ________.
4.6 Symbol used at the beginning of the HREF text is ____G. # ______.
4.7 _____K. DTD _____ defines the syntax of the markup in SGML.
4.8 _____M. CSS list _____ improves the quality of an image without distorting it.
4.9 ____E. RESET ______ creates push button
4.10 ____H. HTTP ______ is an application layer protocol that works on request and response.
5. (a) What are style sheets ? How can
one change the number type in the
middle of the list ?
(b) Explain the three main ways to
apply CSS styles to a web page.
(c) What are pseudo classes and what
are they used for ?
Answer 5 a.
cascading style sheets allows the placing of all the design elements – colours, images, positioning, fonts, sizes and layouts to be placed in a separate file, the style sheet file. The content is placed in a text file or as records of a database. The html code along with other advanced code for supporting dynamic features is placed in the web page. The style sheet and the web page together function as a template, a container with predefined style elements.
When the user calls for a page, the content, the style and the code are combined dynamically to generate a web page.
For example, a CSS style sheet (stored in a "special.css" file) of a paragraph Set the text color to green. and surrounds it with a solid red
border.
p.special [ color - green border solid red ; ]
Changing the number type in the middle of a list The tag contains two attributes The type and valueType attributes can be used to change the numbering type of any list item The value attribute can change the number index.
(B) You can do in three different ways-
External Style Sheet- Styles are specified in an external CSS file. you can change the looks of entire website by using single external style sheet. Eg.: <head> <link rel="stylesheet" type="text/css" href=“ex1.css” /> </head>
Internal Style Sheet- To Appy specific styles to a single HTML file inside the head section of an HTML page. Eg.: <style> p { text-align:left; font-size:24px; } </style>
Inline Styles- Styles are specified inside an HTML tag/element. Eg.: <p style="font-family:Algerian; font-size:28px;"> Demo of Inline Style </p>.
Inline:-
Inline CSS allows you to apply a unique style to one HTML element at a time. You assign CSS to a specific HTML element by using the style attribute with any CSS properties defined within it.
Inline styles in CSS could be useful for previewing changes instantly or adding CSS rules to only one or two elements. When you don't have access to your .css file, knowing how inline style CSS works can be convenient.
In the following example, you can see how to describe CSS style properties for an HTML <p> element in the same line of code. We use a style attribute to assign CSS styling properties.
In this particular case, color and value (blue) apply to the HTML <p> element. <p style="color: blue;">This is a paragraph.</p>
Tip: use of inline CSS is not a recommendation. Combining CSS and HTML leads to messy code. Additionally, inline styles method is difficult to update.
<!DOCTYPE html>
<html>
<body>
<h1> Computer</h1>
<h2 style="color: yellow; background-color: green;">Mouse</h2>
<p style="color: red; font-size: 25px;">Mouse is an electronic device</p>
<h2 style=" color: yellow; background-color: green;">Keyboard</h2>
<p style="color: red; font-size: 25px;">It is used for providing input.</p>
<h2 >Camera</h2> <p>It is used for providing image input.</p>
</body>
</html>
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.
Internal styles are defined within the <style> element, inside the <head> section of an HTML page.
Code of internal css:-
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h2{color: yellow; background-color: green;} p{color: red; font-size: 25px;} </style> </head> <body>
<h1> Computer</h1>
<h2 >Mouse</h2>
<p >Mouse is an electronic device</p>
<h2 >Keyboard</h2>
<p>It is used for providing input.</p>
<h2 >Camera</h2>
<p>It is used for providing image input.</p> </body>
</html>
External css:-
With an external style sheet, you can change the look of an entire website by changing just one file!
Each HTML page must include a reference to the external style sheet file inside the <link> element, inside the head section.
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. Here is how the “design1.css" file looks like:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="design1.css">
</head>
<body>
<h1> Computer</h1>
<h2 >Mouse</h2>
<p >Mouse is an electronic device</p>
<h2 >Keyboard</h2>
<p>It is used for providing input.</p>
<h2 >Camera</h2>
<p>It is used for providing image input.</p> </body>
</html>
Design1.css
h1{color: blue; background-color: yellow;} h2{color: yellow; background-color: green;} p{color: red; font-size: 25px;}
(C) A Pseudo class in CSS is used to define the special state of an element. It can be combined with a CSS selector to add an effect to existing elements based on their states. For Example, changing the style of an element when the user hovers over it, or when a link is visited. All of these can be done using Pseudo Classes in CSS.
A pseudo-class is used to define a special state of an element.For example, it can be used to:Style an element when a user mouses over it Style visited and unvisited links differently Style an element when it gets focus.
All CSS Pseudo Classes
| Selector | Example | Example description |
|---|---|---|
| :active | a:active | Selects the active link |
| :checked | input:checked | Selects every checked <input> element |
| :disabled | input:disabled | Selects every disabled <input> element |
| :empty | p:empty | Selects every <p> element that has no children |
| :enabled | input:enabled | Selects every enabled <input> element |
| :first-child | p:first-child | Selects every <p> elements that is the first child of its parent |
| :first-of-type | p:first-of-type | Selects every <p> element that is the first <p> element of its parent |
| :focus | input:focus | Selects the <input> element that has focus |
| :hover | a:hover | Selects links on mouse over |
| :in-range | input:in-range | Selects <input> elements with a value within a specified range |
| :invalid | input:invalid | Selects all <input> elements with an invalid value |
| :lang(language) | p:lang(it) | Selects every <p> element with a lang attribute value starting with "it" |
| :last-child | p:last-child | Selects every <p> elements that is the last child of its parent |
| :last-of-type | p:last-of-type | Selects every <p> element that is the last <p> element of its parent |
| :link | a:link | Selects all unvisited links |
| :not(selector) | :not(p) | Selects every element that is not a <p> element |
| :nth-child(n) | p:nth-child(2) | Selects every <p> element that is the second child of its parent |
| :nth-last-child(n) | p:nth-last-child(2) | Selects every <p> element that is the second child of its parent, counting from the last child |
| :nth-last-of-type(n) | p:nth-last-of-type(2) | Selects every <p> element that is the second <p> element of its parent, counting from the last child. |
| nth-of-type(n) | p:nth-of-type(2) | Selects every <p> element that is the second <p> element of its parent |
| :only-of-type | p:only-of-type | Selects every <p> element that is the only <p> element of its parent |
| :only-child | p:only-child | Selects every <p> element that is the only child of its parent |
| :optional | input:optional | Selects <input> elements with no "required" attribute |
| :out-of-range | input:out-of-range | Selects <input> elements with a value outside a specified range |
| :read-only | input:read-only | Selects <input> elements with a "readonly" attribute specified |
| :read-write | input:read-write | Selects <input> elements with no "readonly" attribute |
| :required | input:required | Selects <input> elements with a "required" attribute specified |
| :root | root | Selects the document's root element |
| :target | #news:target | Selects the current active #news element (clicked on a URL containing that anchor name) |
| :valid | input:valid | Selects all <input> elements with a valid value |
| :visited | a:visited | Selects all visited links |
