Skip to main content

6. HTML Text Formating

Web pages consist of content. That content must be formatted in some occasions to our needs. The way to do it is by using the Text Formatting elements as outlined bellow. Remember that every element has a start tag and an an tag.

<b>Bold text</b>
<strong>Important text</strong>
<ins>Inserted text</ins>
<i>Italic text</i>
<em>Emphasized text</em>
<sub>Subscript text</sub>
<sup>Superscript text</sup>
<mark>Marked text</mark>
<small>Small text</small>
<del>Deleted text</del>

<b> and <strong> elements


Both elements are quite the same in nature but different in coding so that the web developer makes a difference between them. The visual representation of the code is the same. the <strong> element stresses the importance of the content within that particular element.
<b>Some content</b>
<strong>Some content</strong>

 

<i> and <em>


<i>Some content</i>
<em>Some content</em>

Both elements display the text in italic but the code is different. The <em> element stresses the importance of the content within that particular element.

<ins> element


The <ins> element defines an inserted text (underline text)
<p>Some content is <ins>inserted</ins></p>

<sub> sub-scripted element


Let's say we want to present the number two sub-scripted in this example X2
<p>X<sub>2</sub></p>

HTML Text Formatting elements

<sup> super-scripted element


Let's say we want to present the number two super-scripted in this example X2
<p>X<sup>2</sup></p>

HTML Text Formatting elements

<del> element


Lets say we want to cross line the text developer bellow. To do that we use the <del> element
<p> I am a <del>developer</del></p>

HTML Text Formatting elements

<mark> element


If we want to highlight a portion of a text within paragraph then we use <mark> element for that purpose
<p> I am a <mark>web developer</mark></p>

HTML Text Formatting elements

<small> element


How great would it be if you can manipulate with the size of a text within a heading for an instance
<h1> I am a <small>web developer</small></h1>

HTML Text Formatting elements

Notice how the web developer text is a bit smaller

To recap we learned about the following HTML Text Formatting elements. We can use them anywhere within the <body> of the web pages.
<b>Bold text</b>
<strong>Important text</strong>
<ins>Inserted text</ins>
<i>Italic text</i>
<em>Emphasized text</em>
<sub>Subscript text</sub>
<sup>Superscript text</sup>
<mark>Marked text</mark>
<small>Small text</small>
<del>Deleted text</del>

 

Comments

Post a Comment

Popular posts from this blog

Oracle DBA 11g/12c - Database Administration for Junior DBA

Oracle DBA 11g/12c - Database Administration for Junior DBA Learn to become an Oracle Database Administrator (DBA) in 6 weeks and get a well paid job as a Junior DBA What Will I Learn? Final Goal: Get a job as an Oracle Database Administrator (Oracle DBA) As a Oracle Database Administrator (Oracle DBA), you would be able understand the Database Architecture, which will help you to perform your DBA duties with better understanding. As a Oracle Database Administrator (Oracle DBA), you would be able to Install the necessary Oracle Software/Database As a Oracle Database Administrator (Oracle DBA), you would be able to Administer User accounts in the Database As a Oracle Database Administrator (Oracle DBA), you would be able to Manage Tablespace's to provide required space for the data As a Oracle Database Administrator (Oracle DBA), you would be able perform Backup and Recovery as needed. As a Oracle Database Administrator (Oracle DBA), you would be able to diagnose ...
1 comment
Read more

Data Science, Deep Learning, & Machine Learning with Python

Deep Learning, Data Science, & Machine Learning with Python Go hands-on with the latest neural network, artificial intelligence,deep learning and data science techniques employers are seeking! What Will I Learn? Develop using iPython notebooks Understand statistical measures such as standard deviation Visualize data distributions, probability mass functions, and probability density functions Visualize data with matplotlib Use covariance and correlation metrics Apply conditional probability for finding correlated features Use Bayes' Theorem to identify false positives Make predictions using linear regression, polynomial regression, and multivariate regression Understand complex multi-level models Use train/test and K-Fold cross validation to choose the right model Build a spam classifier using Naive Bayes Use decision trees to predict hiring decisions Cluster data using K-Means clustering and Support Vector Machines (SVM) Build a movie r...
1 comment
Read more

GraphQL with React: The Complete Developers Guide

GraphQL with React: The Complete GraphQL Developers Guide Learn and master GraphQL by building real web apps with React and Node   What Will I Learn? Build amazing single page applications with React JS and GraphQL Master fundamental concepts behind structuring GraphQL servers Realize the power of building flexible data schemas Be the engineer who explains how GraphQL works to everyone else, because you know the fundamentals so well Become fluent in the ecosystem supporting GraphQL, including the differences between Apollo and Relay   Requirements Familiarity with React   Description Note: This course assumes you are familiar with React ! If you're tired of spinning your wheels trying to figure out what type of backend server to use, this is the course for you. Authentication?  You will learn it.   Apollo Data?  Included.   Integration with React?  Of course! This GraphQL Developers Guide will get you up and running with GraphQL q...
Post a Comment
Read more