In this article, you will learn The HTML Blocks and Inline Elements. HTML is made up of many elements that act as the building blocks of a website page. The major purpose of HTML elements is to style the contents. These Elements are divided into two main categories.
» Block Level Elements
» Inline Elements
HTML Block Elements
A block-level element plays a vital role to start on a new line and takes up the full width of a web page, from left to right. A block-level element can take up one line or multiple lines and it can be done to break a line before and after the element.
The <div> element: This element is defined as a container for other elements. It has no need for attributes. Class, style, and ID are normally used attributes.
<!DOCTYPE html> <html> <body> <style> body { text-align: center; } h1 { color: green; } </style> <!-- Div element. --> <div style="background-color:black; color:white; padding:20px;"> <h1>Soft CodeON</h1> <h3>You can give reviews as well as contribute posts on this website.</h3> </div> </body> </html>
<address> | <video> | <ul> |
<tfoot> | <table> | <section> |
<pre> | <article> | <aside> |
<blockquote> | <canvas> | <dd> |
<div> | <dl> | <dt> |
<footer> | <form> | <h1>-<h6> |
<header> | <hr> | <noscript> |
<fieldset> | <figcaption> | <figure> |
<nav> |
The HTML Block elements:
HTML Inline Elemenets
Normally, the inline element does not object cause a line break and does not get up the full width of a web page. The space bounded by its opening and closing element. It is generally used within other HTML elements.
The <span> element defines as a container for HTML text. But normally, it is used to style a certain text within the highest text of the element. The element does not robotic style an HTML element. It doesn’t need any attribute too.
<!DOCTYPE html> <html> <style> body { text-align: center; } h1 { color: green; } </style> <body> <!-- Sapn element. --> <h1>Soft CodeOn<span style="color:red"> for</span>Learn Programming</h1> </body> </html>
<a> | <abbr> | <acronym> |
<textarea> | <object> | <b> |
<bdo> | <big> | <br> |
<button> | <cite> | <code> |
<dfn> | <em> | <i> |
<img> | <input> | <kbd> |
<q> | <samp> | <script> |
<label> | <map> | <output> |
<span> |
If you have any questions about HTML Blocks and Inline Elements put a comment below.