HTML 图像

以前，网页过去仅由文本组成，这使它们看起来很乏味和无趣。幸运的是，为用户添加了在网页上嵌入图像的功能的时间还不够长。让我们看看如何在网页上添加图像。

在网页上添加图像“img”标签用于在网页上添加图像。 “img”标签是一个空标签，这意味着它只能包含一个属性列表，没有结束标签。

句法 ：

属性：

src： src 代表源。每个图像都有一个 src 属性，它告诉浏览器在哪里可以找到要显示的图像。提供的图像的 URL 指向存储图像的位置。

输出 ：

alt：如果图像无法显示，则 alt 属性充当图像的替代描述。 alt 属性的值是用户定义的文本。

HTML

    


     
 
 
inserted image using  tag:
 
 
 
    
 

 

输出：

设置图片的宽度和高度：宽度和高度属性用于指定图像的高度和宽度。默认情况下，属性值以像素为单位指定。
例子：

html

 

    

 

     
 
 
inserted image using  tag:
 
 
 
    
 

 

输出 ：

为图像添加标题：与图像一起，标题也可以添加到图像以提供与插入图像相关的更多信息。为了插入标题，使用了 title 属性。
例子：

html

 

    

 

     
 
 
inserted image using  tag:
 
 
 
    
 

 

输出 ：

为图像设置边框：默认情况下，每张图片周围都有一个边框。通过使用border属性，可以改变边框的粗细。粗细为“0”表示图片周围没有边框。
例子：

html

 

    

 

     
 
 
inserted image using  tag:
 
 
 
    
 

 

输出 ：

对齐图像：默认情况下，图像在页面左侧对齐，但可以使用 align 属性将其居中或向右对齐。
例子：

html

 

    

 

     
 
 
inserted image using  tag:
 
 
 
    
 

 

输出 ：

将图像添加为链接：图像可以用作嵌入了 URL 的链接。可以通过在“a”标签内使用“img”标签来完成。
例子：

html

 

    

 

     
 
 
inserted image using  tag:
 
 
 
    
        
    

 

输出：

点击图片前：

点击图片后：

添加动画图像：也可以使用“img”标签添加 .gif 格式的动画图像。
例子：

html

 
Adding a gif file on a webpage
 

 
    
 

 

输出 ：

使用图像作为背景：图像可以用作网页的背景。为此，我们使用 CSS 的 background-image 属性。
例子：

html

 

 
    
Image As a Background
 
     
 
 
In this example we have specified a
      background for a webpage using an image. 
 
 
 
 

 

输出 ：

支持的浏览器：

• 谷歌浏览器
• IE浏览器
• 火狐
• 歌剧
• 苹果浏览器