BEGINNER CODING TIPS | Part Three | Formatting Paragraphs
How to Format Paragraphs of Text
In the previous two coding tips, we looked at how to change the style of the text. For a recap, please visit:
- Part 1: Bold Font
- Part 2: 5 Text Formats
Why have I created this series?
This section is for new readers of the beginner coding series!
I appreciate that many people understand coding (so if this applies to you, then thanks for stopping by and feel free to correct me in the comments below, or share some additional advice! :D)!
So I met a steemit user called @joeyarnoldvn who commented on one of my previous introduction posts. He gave me a great idea to learn a bit of coding each day so that it is not too overwhelming. Well, I am a believer that knowledge should be shared and so I am sure there are steemit users who are at the same 'coding level' as myself. These posts are for you :D
Every day I will learn a new coding technique and share what I have learned with you!
Your posts will look soooo much better if you learn how to use code to format them.
Again, if you have followed my previous posts, you can jump down to the next section!
Anyway, I used to know the VERY BASICS of coding while at school, and I personally found it super interesting! However, fast-forward that 10 years and I am completely out of practice!
So now I want to refresh my coding skills by learning coding all over again. AND I truly feel that we SHOULD all be making an effort to learn and understand code. The future of technology is so exciting, so we should be embracing it rather than shy away from it!
If you can relate to this, and would love to learn slowly but surely with me, then give me a follow and keep an eye out for my future coding posts :)
Learn how to format paragraphs
Today, we are going to learn how to:
- Create bulleted and numbered lists
- Align text; left, right and center
1A: Create a numbered list
Use the following code without the spaces
< ol >
< li > insert text here < / li >
< li > insert text here < / li >
< / ol >
1B: Create a bulleted list
< ul >
< li > insert text here < / li >
< li > insert text here < / li >
< li > insert text here < / li >
< / ul >
You can differentiate between bulleted and numbered lists by using:
- "ol" for ordered lists aka numbered lists
- "ul" for unordered lists aka bulleted lists
2: Align text; left, right and center
p {
text-align: center;
}
These are the traditional values for text-align:
left
- The default value. Content aligns along the left side.right
- Content aligns along the right side.center
- Content centers between the left and right edges. White space on the left and right sides of each line should be equal.justify
- Content spaces out such that as many blocks fit onto one line as possible and the first word on that line is along the left edge and the last word is along the right edge.inherit
- The value will be whatever the parent element's is.
That's all for now!
So what are you waiting for? Have a go at styling your text and remember to tag me in your posts -I would love to see!
If you enjoyed reading this post, don't forget to upvote it AND leave a little comment :) I love getting to know you all and networking, especially as a newbie!
Wishing you a wonderful week ahead!
Namaste!
P.S. Don't forget to check out my other posts :)
Very educative post, I have gone back to your post,on how to make bold,and the text format, will practice them,I have learned something new today.How do make header larger ?
Hi Carkia, that's great i'm really pleased it has helped you! :D
You can use:
< h1 > insert text here < / h1 >
Remove the spaces!
H1 is the largest size, then the size drops for H2, then H3, and so on forth. :)