AllInWorld99 provides a reference manual covering many aspects of web programming, including technologies such as HTML, XHTML, CSS, XML, JavaScript, PHP, ASP, SQL,FLASH, jQuery, java, for loop, switch case, if, if else, for...of, for...in, for...each,while loop, blogger tips, blogger meta tag generator, blogger tricks, blogger pagination, client side script, html code editor, javascript editor with instant output, css editor, online html editor, materialize css tutorial, materialize css dropdown list,break, continue statement, label,array, json, get day and month dropdown list using c# code, CSS button,protect cd or pendrive from virus, cordova, android example, html and css to make android app, html code play,telerik show hide column, Transparent image convertor, copy to clipboard using javascript without using any swf file, simple animation using css, SQL etc. AllInWorld99 presents thousands of code examples (accompanied with source code) which can be copied/downloaded independantly. By using the online editor provided,readers can edit the examples and execute the code experimentally.


Highlight Important Lines

   When we creating a new post we will write more text, in that some one steps are very important and when the visitor visit your blogger he have a chance to read the important points. So we can highlight the words and attract the visitor and focus to that line.


Animation image for blogger gif image
Step 1:
   After login and enter your post Click template and Edit HTML.

blogger edit html


Step 2:
  After clicking the "Edit HTML" you will see like below image.

edit Blogger HTML code


Step 3:
  Press ctrl+F and find the name using </head>.


Step 4:
  Just add the following code above the </head> tag.

<style>.allinworlddivcls{width:100%;height:44px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixHoJCvrjHK7lEm7taCQal3ycj8QIbartZMAZRLsxaLqqmu3hJ_ZMH65bR_5dOh7U2cg6Ev2RaRTQRWQ4-b8O8a9WK3_0yWl8syaYsnpU9jvEmWBwUf7rs4RLz_6V8tykdXKMi9B4O7Iww/s1600/first.png);background-repeat:no-repeat}.allinworlddivcls:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEXNQVkjSAHo-yAY-RxsrP_LliHQF7etj_3dc-3rGG9vPv1xcZaKLxfhbdkNtDivxhEq8syyw2_AAs3RIdMkeXgh7VIoDp_qRmCILWyxLbQ554yPoyierEXDIU-BWck6efG5Swiw22wMOa/s320/second.png);/*allinworld99.blogspot.com*/background-repeat:no-repeat}.allinworldspacls{margin-left:46px;float:left;margin-top:14px}</style>

Step 5:
   After placing the above code, click "Save template".

Place Style tag in blogger


Step 6:
  Finished when you want to high light the line, Switch to HTML mode.

blogger post in html mode

Step 7:
  Replace the text "First Important Line" to your text. And place the below code with HTML mode. 
<div class="allinworlddivcls">
<span class="allinworldspacls">First Important Line</span>
</div>

<div class="allinworlddivcls">
<span class="allinworldspacls">Second Important Line</span>
</div>

<div class="allinworlddivcls">
<span class="allinworldspacls">Third Important Line</span>
</div>

<div class="allinworlddivcls">
<span class="allinworldspacls">Fourth Important Line</span>
</div>
The above code output is show below
First Important Line
Second Important Line
Third Important Line
Fourth Important Line

0 comments:

Post a Comment

Total Pageviews