Friday, May 29, 2020
What is the HTML Section Tag <section>
The HTML <section> tag is used to define sections in a document. When you put your content on a web page, it may contains many chapters, headers, footers, or other sections on a web page that is why HTML
HTML <section> is a new tag introduced in HTML5.
Many times we want to be original when we write a post on our blog. And we are also looking for different ways to make our post look more attractive, tidy, and esthetic.
We look for ways and codes, to be able to show our ideas in a way that attracts readers.
In Blogger there are not as many methods to decorate our articles as there are in other CMS.
That is why we are always looking for how to adapt and use codes from other places and use them in our templates.
In this article I am going to show you how to use a small code inside your Blogger Post to show a very nice text box.
It is very easy and changing the values of the RGB and HEX colors you can get a design and colors like the design of your Blog.
1. Go and write your Article / Post in Blogger with Edtor in HTML mode
2. Copy and paste the following code in your Post.
<!DOCTYPE html>
<html>
<head>
<title>Testing</title>
<style>
#ABC {
background-image: linear-gradient(45deg,rgb(218,34,255) 30%,#9733ee 90%);
padding: 1em;
border-radius: 3px;
margin: 1em 0;
color: #fff;
}
</style>
</head>
<body>
<section id="ABC">
Lorem ipsum dolor sit amet, <mark>consectetur</mark> adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</section>
</body>
</html>
3. Change the text Lorem ipsum dolor sit amet .... with your own text to show in your Post.
4. Change RGB color values rgb(69,104,220) and HEX color #b06ab3 ,to make a gradient of another color according to the design of your Blogger Template.
5. Save the Post and see the results.