UrbanPro
true

Learn HTML from the Best Tutors

  • Affordable fees
  • 1-1 or Group class
  • Flexible Timings
  • Verified Tutors

Search in

Inline & Block Elements

Anitha Sahu
16/03/2017 0 0

HTML Block and Inline Elements:
Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline.

Block-level Elements
A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can).

The <div> element is a block-level element.
Examples of block-level elements:

<div>
<h1> - <h6>
<p>
<form>
Inline Elements
An inline element does not start on a new line and only takes up as much width as necessary.

This is an inline <span> element inside a paragraph.

Examples of inline elements:

<span>
<a>
<img>
The <div> Element
The <div> element is often used as a container for other HTML elements.

The <div> element has no required attributes, but both style and class are common.

When used together with CSS, the <div> element can be used to style blocks of content:

Program:
-------
<!DOCTYPE html>
<html>
<body>

<div style="background-color:black;color:white;padding:20px;">
<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
<p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
</div>

</body>
</html>

The <span> Element:
------------------
The <span> element is often used as a container for some text.

The <span> element has no required attributes, but both style and class are common.

When used together with CSS, the <span> element can be used to style parts of the text:

<!DOCTYPE html>
<html>
<body>

<h1>My <span style="color:red">Important</span> Heading</h1>

</body>
</html>

 

0 Dislike
Follow 0

Please Enter a comment

Submit

Other Lessons for You

Colors that you can use to design your Web Pages
HTML Colors Three Options to define Color1. Color Name - red, blue, green2. Hexadecimal Code - Example #7FFFD43. RGB - RGB (31,205,197) Every color is made up of three colors: Red, Green and Blue.You...

Types Of CSS
There are total 3 types of CSS: 1) Inline CSS. 2) Internal CSS. 3) External CSS. Meaning of these 3 CSS : 1) Inline CSS: Assign within html tag only. 2) Internal CSS: Assign within perticular html...

Website Designing: HTML CSS
HTML: Hyper Text Markup Language. CSS: Cascadding Style Sheet: Display Property. In web designing: CSS concept display property concept is used for any block design. Display property have two properties: 1)...

HTML(Hypertext Markup Language) for creating web pages by Kris, konrad, andy
Html stands for Hypertext Markup Language. It's the computer language at the heart of World Wide Web. When creating a website, html is used to put text, pictures, animations, video, sound onto individual...

Top Programming Languages 2017: Every Beginner Should Learn
Every year a plethora of job opportunities are being created for skilled programmers. So if you are thinking of honing your coding skills it is really a bright idea. But with so many programming languages...
X

Looking for HTML Classes?

The best tutors for HTML Classes are on UrbanPro

  • Select the best Tutor
  • Book & Attend a Free Demo
  • Pay and start Learning

Learn HTML with the Best Tutors

The best Tutors for HTML Classes are on UrbanPro

This website uses cookies

We use cookies to improve user experience. Choose what cookies you allow us to use. You can read more about our Cookie Policy in our Privacy Policy

Accept All
Decline All

UrbanPro.com is India's largest network of most trusted tutors and institutes. Over 55 lakh students rely on UrbanPro.com, to fulfill their learning requirements across 1,000+ categories. Using UrbanPro.com, parents, and students can compare multiple Tutors and Institutes and choose the one that best suits their requirements. More than 7.5 lakh verified Tutors and Institutes are helping millions of students every day and growing their tutoring business on UrbanPro.com. Whether you are looking for a tutor to learn mathematics, a German language trainer to brush up your German language skills or an institute to upgrade your IT skills, we have got the best selection of Tutors and Training Institutes for you. Read more