Have you ever wondered how things work after clicking a button on any website or a program? Is there any magic happens or someone controls at the back end, waits for you to click a button and then performs a particular action? I always asked myself this question when I was a child and still exploring different options.
Using HTML Tags In Your Comments
Since I have been working on some coding stuff, I now know how buttons work in a browser and figured out that there is a lot of styling we can use while posting our comments with some easy tags on Steemit. All those options that you see while posting your own post can be implemented in the comment section.
Let's go through each option one by one.
B (Bold)
Whenever we want to bold any text, we use a shortcut key Ctrl+B or simply press the option "B" but you can't use these options while commenting on any post. Whatever text you want to bold simply place this tag <b> before and this </b> after the words you want to bold.
Example
I (Italic)
This is same as bold but instead of letter "B", we use "I" to italicize words. Just put <i> before and </i> after the sentence/words your want to italicize.
Example
Strikethrough
Strikethrough is writing some words or a complete sentence with a horizontal line through their center. We use <del> before and </del> after the words/sentence we want to strikethrough.
Example
{ } (Monospace)
This text style is usually used by developers, to showcase their coding work with a special text instead of pasting the code in a usual way. What you have to do is to write <code> before and </code> after the code you want to insert in your comment.
Example!
Order and Unorder List
Suppose you want to list down some options in your comment section, instead of just entering and manually writing numbers, you can use HTML tags for both order and unorder list. Let me give you an example how it's done.
First write the opening and closing ul tags like this
<ul>
</ul>
In between these tags, place your list tags with the opening and closing tags (<li></li>
So the complete code would be like this
<ul>
<li>This is Steemit</li>
<li>This is Facebook</li>
<li>This is Twitter</li>
<li>This is Youtube</li>
</ul>
Same goes with the order list but instead of bullets, numbers would be shown and you have to use <ol></ol> tags instead of <ul></ul>.
Example
Blockquote
Tags used to put sentence in a blockquote is it's own name with opening and closing brackets, like this <blockquote></blockquote>
Example
Headings
Making headings is also simple, there are total 6 heading sizes you can use in your posts/comments, from H1 to H6. H1 is the highest and H6 is the smallest. Just like other tags, you have to put heading tags before and after your text.
Example
<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
<h3>This is Heading 3</h3>
<h4>This is Heading 4</h4>
<h5>This is Heading 5</h5>
<h6>This is Heading 6</h6>
This is Heading 1
This is Heading 2
This is Heading 3
This is Heading 4
This is Heading 5
This is Heading 6
Creating a Hyperlink
Directing to another website or page by creating a link on some specific words can be done using <a> as opening and </a> as closing tag with an attribute "href". I am not going to explain what attribute means in HTML but it is important to write this attribute to in order to make a working link. The code for creating a hyperlink is
<a href="https://www.google.com.pk">Hyperlink</a>
Example
You have a nice take on explaining HTML with a touch of steem in it.
Thank you.