Jobless Panda App Of The Year ("Best Earning App"):
Keep the app open and Earn Money!!

App Link: Click Here!

Referral code: LY4AU6VSAN [Get extra 0.25$ starting bonus for using my referral code!]

Step 01: Install the Poll Pay app and press the shown button!

Step 02: Install the shown apps and keep them open!

Step 03: You will get money for keeping them open!


Thursday, June 4, 2020

How To Display Code In Blogger Posts?

In this article, we going to learn how you can show programming code in your blogger post. The simplest way to do this is by writing your code on the post editor. But the problem is this code is shown in a post in a very bed look as you can see in the image.

So let's learn how you can show your code in a better way. For this, you need to give some CSS style to your code. First, go to HTML editor, then add class to your code. Then give CSS code for the class in style tag! As you can see down below:

 /* CSS For Code */
.code { background:#f5f8fa; background-repeat:no-repeat; border: solid #5C7B90; border-width: 1px 1px 1px 20px; color: #000000; font: 13px &#39;Courier New&#39;, Courier, monospace; line-height: 16px; margin: 10px 0 10px 10px; min-height: 16px; overflow: auto; padding: 28px 10px 10px; width: 90%; }
.code:hover { background-repeat:no-repeat; }

<div class="myCode">
<img src="myImg"/>

Now your image code will look like this:

So if you want this style for programming code every time you write the post. For this, add your style in "Theme", then you don't need to write it again in every post. For adding your style in "Theme" go to "Theme" section, click on "Edit HTML". Add you CSS code in style tag then click "Save". Now when you write any post you just add "code" class on programming code no need to give style again. Then it will work for all your posts.

Hope this helps you if you have any query please do comment below:)

No comments:
Write comments

© 2019 Jobless Panda. Designed by Bloggertheme9 | Distributed By Gooyaabi Templates