HTML insert image example (html add image)

HTML insert image example (html add image)

Inserting images into HTML requires HTML tags to display them, which can be achieved using the img tag.

1. HTML image tag syntax


Copy code
The code is as follows:

<img src="divcss5-logo-201305.gif" width="165" height="60" />

img introduction:

src is followed by the image path address

width Set the image width

Height Set the image height

2. Specific HTML picture display example - TOP

We insert three pictures into the HTML source code, one with the original size, one with a smaller width and height, and one with a larger width and height.

1. Complete HTML code of the example:


Copy code
The code is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Image insertion html online demonstration <a href="http://www.vcss.com</title">www.vcss.com</title</a>>
</head>

<body>
<p>Original large image</p>
<p>
<img src="divcss5-logo-201305.gif" width="165" height="60" />
</p>
<p>Small image</p>
<p>
<img src="divcss5-logo-201305.gif" width="105" height="30" />
</p>
<p>Enlarge the image</p>
<p>
<img src="divcss5-logo-201305.gif" width="365" height="120" />
</p>
</body>
</html>

2. Screenshot of HTML inserting picture example

HTML picture insertion display example screenshot

<<:  Problems with configuring https server and reverse proxy with Nginx under Windows

>>:  Tips for turning pixels into comprehensive brand experiences

Recommend

Solution to the problem that Navicat cannot remotely connect to MySql server

The solution to the problem that Navicat cannot r...

JS realizes the front-end paging effect

This article example shares the specific code of ...

Apache Calcite code for dialect conversion

definition Calcite can unify Sql by parsing Sql i...

The best way to start a jar package project under Centos7 server

Preface Everyone knows how to run a jar package o...

The difference between z-index: 0 and z-index: auto in CSS

I've been learning about stacking contexts re...

How to make a website look taller and more designed

“How to make a website look high-end? Or more des...

Example of how to deploy Spring Boot using Docker

Here we mainly use spring-boot out of the box, wh...

JavaScript to implement random roll call web page

JavaScript writes a random roll call webpage for ...

What can I use to save you, my table (Haiyu Blog)

Tables once played a very important role in web p...

Let's talk about destructuring in JS ES6

Overview es6 adds a new way to get specified elem...