HTML

1. What is HTML?
Ans. HTML stands for HyperText Markup Language. It is also the
most popular markup language for creating websites that can be
viewed in a web browser.
2. What is the difference between HTML elements and tags?
Ans. HTML elements communicate to the browser how to render
text. When surrounded by angular brackets <> they form HTML
tags, which come in pairs and surround the text.
3. What does DOCTYPE mean?
Ans. The term DOCTYPE means Document Type Definition and
tells the browser which type of HTML is used on a webpage.
Browsers use DOCTYPE to determine how to render a page.
4. What are some new HTML5 markup elements?
Ans. Among several: <article>, <aside>, <bdi>, <command>,
<details>, <figure>, <figcaption>, <summary>, <header>,
<footer>, <hgroup>, <mark>, <meter>, <nav>, <progress>,
<ruby>, <rt>, <section>, and <time>.
5. What are the new image elements in HTML5?
Ans. The new image elements in HTML5 are Canvas and WebGL.
<canvas> is a new element that acts as a container for graphical
elements like images and graphics. WebGL stands for Web
Graphics Language, a free cross-platform API that is used for
creating 3D graphics in web browsers.
6. Do all HTML elements need both opening and closing tags?
Ans. Not really, elements like <img src=””/> or <input type=””/>
don’t need a closing tag.
7. What is a marquee?
Ans. A marquee is used to enable scrolling text on a web page.
So, to do this, just place whatever text you want to appear
scrolling within the <marquee> and </marquee>tags.
8. How do you create links to sections on the same page?
Ans. Links can be created using the tag, with referencing through
the use of the # symbol. For example, we can have

<a href=”#top”> BACK TO TOP</a>

which would result in the words “BACK TO TOP” appearing on the

webpage and links to a bookmark named top. We can then
create a separate tag like:

<a name=top></a>

somewhere on the same webpage so that the user will be linked

to that place when clicking on “BACK TO TOP”.

CSS
1. What is CSS?
Ans. CSS stands for Cascading style sheets. It describes to the
user how to display HTML elements on the screen in a proper
format. CSS is the language that is used to style HTML
documents. In simple words, cascading style sheets are a
language used to simplify the process of making a webpage.
CSS is used to handle some parts of the webpage. With the
help of CSS, we can control the colour of text and style of
fonts, and we can control the spacing between the paragraph
and many more things. CSS is easy to understand but provides
strong control on the Html documents. CSS is combined with
HTML.
2. What is the origin of CSS?
Ans. SGML (Standard Generalized Markup Language) is the
origin of CSS. It is a language that defines markup languages.
3. What are the possible ways to apply CSS styles to a web
page?
Ans. CSS can be applied in the following three ways:
• Linked: Create a separate .css file and add all the styles for
the web page there. Make sure the file is linked to the HTML
document(s) using the link tag
• Embedded: Inside the HTML document, open a style tag and
inside that, add all styles just like you’d do on a linked file.
• Inline: This is done by adding a style attribute inside an
HTML element.
4. What are the CSS frameworks?
Ans. CSS frameworks are the preplanned libraries which make
easy and more standard compliant web page styling. Eg.
Bootstrap.
5. What is a CSS selector?
Ans. It is a string that identifies the elements to which a
particular declaration apply. It is also referred as a link
between the HTML document and the style sheet. It is
equivalent of HTML elements. There are several different
types of selectors in CSS: -
 CSS Element Selector
 CSS Id Selector
 CSS Class Selector
 CSS Universal Selector
 CSS Group Selector
6. What is a Class selector and how does it differ from an ID
selector?
Ans. Class selectors are used to applying a style to multiple
HTML elements identified with the same class. They are called
within the CSS document by a ‘.’ (dot), followed by the class
name.
 The difference between classes and IDs is that an HTML
element can accept multiple classes, but only one ID. That
means IDs are unique for HTML elements.
7. What is grouping used for in CSS?
Ans. Grouping allows several elements of HTML to have the
very same styles applied. Moreover, it uses a single declaration
and selectors and is separated by commas.
8. Which command is used for the selection of all the elements
of a paragraph?
Ans. The p[lang] command is used for selecting all the
elements of a paragraph.
9. Explain the CSS box model.
Ans. The CSS box model is made up of margins, borders,
padding, and content. Furthermore, the box model provides a
more structured way to space elements in relationship to each
other in web pages.
10. What is the difference between inline and block elements?
Ans. Basically, a block element will take up the whole width
available, and comes with a line break before and after.
Examples of block-level elements are: headings (i.e <h1>),
Paragraphs(<p>), divisions(<div>) etc. In contrast, inline
elements take up only the space they need and do not force
line breaks. For example: anchors (<a>), spans(<span>) etc.
11. What is the difference between visibility:hidden and
display:none?
Ans. Although these two properties seem similar, there is quite
an important difference between the two:
• visibility:hidden hides the element, but it will still take up
space, this way affecting the layout of the document.
• display:none also hides the element, but will not take up
space and the page will appear as if the element is not
present.
12. What are child selectors in CSS?
Ans. Child selectors represent a way of grouping (for styling) a
set of elements that descend from a parent element.
13. What are grid systems and why do we use them in web
pages?
Ans. Grid systems are structured rules that enable content to
be stacked horizontally and vertically consistently and
sustainably.
They find heavily usage in today’s websites because they offer
increased productivity while coding, they’re versatile and ideal
for responsive layouts.
14. How do we use shorthand properties and why?
Ans. Shorthand properties cannot be applied to any CSS
property but only a few like border, outline, padding,
background etc. Shorthand properties reduce file size thus
improving page load time. Then the trick stands for listing all
property values on a single line, in a pre-defined order that
must be respected.
15. What is the purpose of the z-index and how to use it?
Ans. The z-index property specifies the stack order of an
element within the document area (or a part of it). An element
with greater stack order will always be in front of an element
with a lower stack order. However, z-index only works on
positioned elements (position:absolute, position:relative, or
position:fixed). It can have four kinds of values:
 Auto: Sets the stack order equal to its parents.
 Number: Orders the stack order.
 Initial: Sets this property to its default value (0).
 Inherit: Inherits this property from its parent element.
16. Explain what pseudo-classes are and their usage.
Ans. We use Pseudo-classes to define a special state of an
element. So, note that pseudo-classes find no definition in the
markup. We can use them for:
 1. Styling an element on mouseover (hover)
2. Styling an element when it gets focus
3. Styling visited/unvisited links
17. What are media queries and how to use them?
Ans. A media query consists of a media type and at least one
expression that limits the style sheets’ scope by using media
features, such as width, height, and colour. Media queries,
added in CSS3, let the presentation of content be tailored to a
specific range of output devices without having to change the
content itself.