Showing posts with label web design. Show all posts
Showing posts with label web design. Show all posts

Friday, 31 July 2020

How to Create Float Image

This tutorial is about to create float image that will always show on your corner blog althought you drag side…


To use a floating image in HTML, use the CSS property float. It allows you to float an image left or right. More property values include the following:

Sr.No.
Property Value & Description
1
none

Not floated
2
left

Floats to the left
3
right

Floats to the right
4
initial

Default value

Example

You can try to run the following code to use floating image in HTML. Here’s the usage of float right and float left CSS attribute

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Floating Image</title>
   </head>

<body>
   <h1>Float Right</h1>
   <p>The below image floats to the right.</p>
   <p>
      <img src="https://www.widecoder.com/green/images/logo.png" style="float:right" width="190" height="84" />
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
      This is demo text. This is demo text.
   </p>
   <h1>Float Left</h1>
      <p>The below image floats to the left.</p>
      <p>
         <img src="https://www.widecoder.com/green/images/logo.png" style="float:left" width="190" height="84" />
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
         This is demo text. This is demo text.
      </p>
   </body>
</html>

Thursday, 23 July 2020

Add Author Comment Differentiate Code for Blogger



"Add Code to Differentiate Author comments From others"

Here is simple code which you have to install in your template, which differentiate author comments from Visitors Comment in your blog comment section. You can change color what you want of background. Font Style and color. This modification is in two parts , that is CSS , Stylesheet. We first modify CSS part.