TuTorial; how to use Html tags(Not shown in official tutorial!!) in order to style your article.

celestialme (46) in steemit • 7 years ago (edited)

In this article i want to teach you and show you how to use html tags in order to style your article and so on. i will show you the ones that is not mentioned in official tutorial and also how to use the alternate html tags for the ones is shown in official tutorial. and of course not every Html tag works so i made complex work to find out which one is appropriate. so lets get started.
1). < center > Text < /center> without spaces. < center> is Html tag which brings text into center.

Text
2).bold strong
< b> < /b>
< strong> < /strong>
they might appear the same but Programmatically they use different ways of doing it. might be meaningless for this purpose use any one of these.
3).try and use more then one spaces or tab into your text. can't you? i am here to show you how to overcome this problem. and here comes magical html tag into play.
< pre> < /pre> is the tag which gives every letter its fixed position. lets check this out

Text in a pre element
is displayed in a                     fixed-width
font, and it preserves
both      spaces and
line                          breaks

4).Emphasize your text with using < em> < /em> tag

Emphasized text ; Not-Emphasized text
5).do you want to separate your paragraphs more obviously? use horizontal lines. for that < hr> will help.
1 opinion

2 opinion

3 opinion

gives your article more readability

6). if you want to mention disabled or incorrect sentence use < strike> < del> tags. same story as "bold" and "strong"

Version 2.0 is ~~not yet available!~~ now available!

7). are you tired of ugly quotation marks? like "" ↫ these? check out how beautiful they are. for this use < q> html tag.

Build a future where people live in harmony with nature.
We hope they succeed.

8). use superscript and subscript by using html < sub> < sup> tags. look how cool they are.
Hydrogen¹₁
9).use < img> tag for nice image inputs.
< img src="https://steemitimages.com/0x0/https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRb5UjspY1GV7_EmwVIyo18OpDifjcKlGCZin0vkoipqB3n3UQtYL8t4XvY" >

and with the combination of < pre> you can have this picture anywhere you like.

< pre> {spaces there as much as you want to generate fixed position} < img src="https://steemitimages.com/0x0/https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRb5UjspY1GV7_EmwVIyo18OpDifjcKlGCZin0vkoipqB3n3UQtYL8t4XvY" > < /pre>

cool isn't it?

10). now we are going in hard styling. tables

Earnings
Author rewards	3$
Curation rewards	0.36$
Comment rewards	11.10$

for this we are gonna be using Html < table> tag With its association tags like < th> which make header like cells. < td> makes ordinary cells which contains information. < tr> which defines table row. and in which will be placed < td> tags.

< table> < th> Earnings< /th>

< tr> < td>Author rewards< /td> < td>3$< /td> < /tr> < tr> < td>Curation rewards< /td> < td>0.36$< /td> < /tr> < tr> < td>Comment rewards< /td> < td>11.10$< /td> < /tr> < /table>




11). ordered and unordered lists.

  Coffee
  Tea
  Milk


  Coffee
  Tea
  Milk

< ol >

< li>Coffee< /li>

< li>Tea< /li>

< li>Milk< /li>

< ul>
  < li>Coffee< /li>
  < li>Tea< /li>
  < li>Milk< /li>
< /ul>
ol = ordered list
ul = unordered list
li = list item

 in order  this code to work you have to delete spaces after  < mark both at start and end.

steemit art blog contest news

7 years ago by celestialme (46)

$5.55

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!

Sort Order:

Trending

[-]

venuspcs (65) · 7 years ago (edited)

I am flagging this post for the many many many mistakes you made in the post above; as well as for it being heavily covered in numerous other Guides on Steemit.

I am giving this a 25% flag!

$0.39

3 votes

[-]

celestialme (46) · 7 years ago (edited)

i am waiting for links where this all is collected. waiting for explanation which one did you consider as mistake. your reply is nothing but the flame and covers nothing. you should be banned for lie as well. 100% flag for nothing.

$0.00

[-]

venuspcs (65) · 7 years ago

Your grammar and punctuation have many mistakes. Several times your code is flawed (you have opening html tag but now the closing html tag.

As for links here ya go:

Dozens upon dozens more can be found by searching on asksteem.com

$0.00

2 votes

[-]

celestialme (46) · 7 years ago (edited)

1st link includes < p> tag which i have not talked about so its meaningless. and shows img tag usage, but does not show how to set image position so this sucks.
2nd link shows nothing but < br> and strong tag and some history of html tags i have not shown < br> tag because it refers just as pushing enter key so meaningless, but shows strong tag. i made parallel between strong and bold so my is more informative.
3rd link again not informative at all.
4th link is anything written even there? i see only some forum link :/
and last link i don't care about someones cheat sheet. even though this is all about < p> tag and center and img. less informative.
those links proves nothing . all of them are less informative than mine. so just tell me were can i report you for non reasonable flags. :)
and last you tell me about grammar
Your grammar and punctuation have many mistakes. Several times your code is flawed (you have opening html tag but ~~now~~ not the closing html tag.
and this sentence is stylistically wrong. since i don't have opening and closing tags because i am human and not code. my html code otherwise can have opening and closing tags. where should i report you? because i don't deserve flag for couple of miss type.
and 1 more thing in those guys contents is repeated < p> and < center> tags but i don't see your flag on their post. :)