Question 1

1) Name the property used to specify the background color of an element.

Accepted Answer

The background-color property is used to specify the background color of the element. For example:

    
h2,p{    
    background-color: #b0d4de;    
}

Question 2

2) Name the property for controlling the image repetition of the background.

Accepted Answer

The background-repeat property repeats the background image horizontally and vertically. Some images are repeated only horizontally or vertically.

    
body {    
background-image: url("paper1.gif");    
margin-left:100px;    
}

Question 3

3) Name the property for controlling the image position in the background.

Accepted Answer

The background-position property is used to define the initial position of the background image. By default, the background image is placed on the top-left of the webpage.

You can set the following positions:

center
top
bottom
left
right
background: white url('good-morning.jpg');  
background-repeat: no-repeat;  
background-attachment: fixed;  
background-position: center;

Question 4

4) Name the property for controlling the image scroll in the background.

Accepted Answer

The background-attachment property is used to specify if the background image is fixed or scroll with the rest of the page in the browser window. If you set fixed the background image, then the image not move during scrolling in the browser. Let's take an example with the fixed background image.

background: white url('bbb.gif');  
background-repeat: no-repeat;  
background-attachment: fixed;

Question 5

5) What is the difference between inline, embedded and external style sheets?

Accepted Answer

Inline: Inline Style Sheet is used to style only a small piece of code.

Syntax
      
       
Embedded: Embedded style sheets are put between the ... tags.

Syntax
    
body {    
    background-color: linen;    
}    
h1 {    
    color: red;    
    margin-left: 80px;    
}     
    
       
External: This is used to apply the style to all the pages within your website by changing just one style sheet.

Syntax

Question 6

6) What is the CSS Box model and what are its elements?

Accepted Answer

The CSS box model is used to define the design and layout of elements of CSS.

The elements are:

Margin - It removes the area around the border. It is transparent.
Border - It represents the area around the padding
Padding - It removes the area around the content. It is transparent.
Content - It represents the content like text, images, etc.

Question 7

7) What is the float property of CSS?

Accepted Answer

The CSS float property is used to move the image to the right or left along with the texts to be wrapped around it. It doesn't change the property of the elements used before it.

To understand its purpose and origin, let's take a look at its print display. In the print display, an image is set into the page such that text wraps around it as needed.

Question 8

8) How to center align a div inside another div?

Accepted Answer

HTML:

your content
CSS:

.cn {
	display: table-cell;
	width: 500px;
	height: 500px;
	vertical-align: middle;
	text-align: center;
}

.inner {
	display: inline-block;
	width: 200px; height: 200px;
}

Question 9

9) What is the difference between inline, inline-block, and block?

Accepted Answer

Block Element: The block elements always start on a new line. They will also take space for an entire row or width. List of block elements are , .

Inline Elements: Inline elements don't start on a new line, they appear on the same line as the content and tags beside them. Some examples of inline elements are ,  , , and  tags. 

Inline Block Elements: Inline-block elements are similar to inline elements, except they can have padding and margins added on all four sides.

Question 10

10) How do we make a rounded corner by using CSS?

Accepted Answer

#rcorners1 {
    border-radius: 25px;
    background: #715751;
    padding: 20px;
    width: 200px;
    height: 150px;   
}





The border-radius Property
Rounded corners for an element with a specified background color:
Rounded corners!

Question 11

11) How will you add border images to an HTML element?

Accepted Answer

We can set the image to be used as the border-image alongside an element by using the property of CSS “border-image”.

Example:

#borderimg {
    border: 15px solid transparent;
    padding: 20px;
    border-image: url(border.png) 30 round;
}

Question 12

12) What is CSS flexbox?

Accepted Answer

It allows you to design a flexible responsive layout structure without using any float or positioning property of CSS. To use CSS flexbox you need to define a flex container initially.

Example:






.flex-container {
  display: flex;
  background-color: #f4b042;
}

.flex-container > div {
  background-color: #d60a33;
  margin: 10px;
  padding: 20px;
  font-size: 30px;
}






  1
  2
  3 

 Example of  flexbox.

Question 13

13) What is the difference between padding and margin?

Accepted Answer

In CSS, the margin is the property by which we can create space around elements. We can even create space to the exterior defined borders.

In CSS, we have margin property as follows:

margin-top
margin-right
margin-bottom
Margin-left
Margin property has some defined values as shown below.

Auto – Using this property browser calculates the margin.
Length – It sets the margin values in px,pt,cm etc.
% – It sets the width % of the element.
Inherit – By this property we can inherit the margin property from the parent element.
In CSS, padding is the property by which we can generate space around an element’s content as well as inside any known border.

CSS padding also has properties like,

Padding-top
Padding-right
Padding-bottom
Padding-left
Negative values are not allowed in padding.

div {
padding-top: 60px;
padding-right: 40px;
padding-bottom: 50px;
padding-left: 70px;
}

Question 14

14) What is CSS opacity?

Accepted Answer

It is the property that elaborates on the transparency of an element.

By this property, we can transparent the image that can take the values from 0.0-1.0. If the value is lower, then the image is more transparent. IE8 and earlier versions of the browser can take the values from 0-100.

img {
opacity: 0.6;
filter: alpha(opacity=60); /* For IE8 and earlier */}

Question 15

15) Define ‘important’ declarations used in CSS.

Accepted Answer

Important declarations are defined as that declaration which is having more importance than the normal declaration.

While executing, these declarations override the declaration which is having less importance.

For example, if there are two users having an important declaration then one of the declarations will override the declaration of another user.

For Example:
Body {background: #FF00FF !important; color: blue}

In this body, the background has more weight than the color.

CSS for styling website

CSS for styling website

Css border and background

The border-radius Property

Overview

What are the requirements?

What I am going to get from this course

Target Audience

+1-800-543-5571

Request more information

Frequently Asked Questions

What kind of learning does ITlearn360.com provide?

Who are the instructors @ITlearn360.com?

Are classes @ITlearn360.com conducted through online video streaming?

Don't miss out, stay tuned!

Offered Academies

Software Testing Academy

Code Academy

Cloud Academy

Career Guidance Academy

Cyber Security Academy

Information

Home

All Courses

Career Paths

Get Started

Contact us

About Us

Mail us @ training@itlearn360.com

Call us @ +1-(800) 543-5571