Are HTML5 tags case sensitive ?
In this article, we will discuss the overview of case sensitivity in HTML5. We will see the example related to it for more understanding. All the HTML elements/tags are case-insensitive. Case-insensitive means the tags/elements which are used in the code are understandable by the browser irrespective of the letters being the upper case or lower case classes.
Note: It is recommended to use all tags in lowercase or uppercase for best practice and better understanding.
Example 1: This example contains all the tags in lowercase.
HTML
<!DOCTYPE html> <html> <body> <h2>Welcome To GFG</h2> <p>Beginner for Beginner</p> <p>The code has lowercase body tags</p> </body> </html> |
Output:
Example 2: This example contains some tags with both uppercase and lowercase alphabets. This example has <boDY> tag which has a combination of both upper and lowercase alphabets, but still, it does not affect the output.
HTML
<!DOCTYPE html> <html> <boDy> <h2>Welcome To GFG</h2> <p>Beginner for Beginner</p> <p>The code has both upper and lowercase tags.</p> </boDy> </html> |
Output:
Note: You can see that both the above code snippets generate the same output.
Example 3: We used multiple tags in mixed case but we have still reached to the desired output. Tags used in mixed case in the below example are <HEAd>, </TitLe>, </heAd>, <BoDy>, <StrONg>, </STroNG>, <P>, </p>, </bR> and </HTmL>.
HTML
<!DOCTYPE html> <HTML> <HEAd> <Title>Welcome to GFG</TitLe> </heAd> <BoDy> <StrONg>Hello World!</STroNg> <p> This is an example of Case-insensitivity in HTML </bR>Observe the output </p> </body> </HTmL> |
Output: