OneBite.Dev - Coding blog in a bite size

indent in html without css

Code snippet for how to indent in html without css with sample and detail explanation

Indent in HTML without CSS

HTML, HyperText Markup Language, forms the foundational structure of web content. Indentation in HTML text, can be performed without resorting to CSS style rules. This article will walk you through the process of creating an indentation without using CSS, using a simple code snippet as an example.

Code snippet for HTML Indentation

An example of HTML indentation without using CSS is shown below:

<!DOCTYPE html> 
<html> 
    <head> 
    <title> Indent Example </title> 
    </head> 
    <body> 
        <blockquote> 
            This is an example of how to make an indent in HTML without using CSS.
        </blockquote> 
    </body> 
</html>

Code Explanation for HTML Indentation

Let us break down the code snippet provided to understand how it works:

  • <blockquote>: The <blockquote> HTML element represents a section that is quoted from another source. Browsers usually indent such lines.

In this case, we are using the <blockquote> element to create an indentation effect, as most web browsers by default render <blockquote> as an indented text block without the need for any CSS styling.

Within the <blockquote> tags, we include the text: "This is an example of how to make an indent in HTML without using CSS.". This is the text that will appear indented on the web page.

Overall, the <blockquote> HTML tag provides a straightforward method to achieve indentation in HTML text without the use of CSS. However, keep in mind that the <blockquote> tag is not semantically correct for indenting non-quoted text, even though it is a commonly employed method due to its simplicity.

In conclusion, while CSS generally provides a more flexible and extensive way of manipulating text appearance on web pages, HTML also provides a few ways for indenting text, with the <blockquote> tag being one of the most uncomplicated methods.

css