首页 > 其他 > 详细

图像标签&&标签属性

时间:2020-11-20 14:59:21      阅读:18      评论:0      收藏:0      [点我收藏+]
图像是网页构成中最重要的元素之一,美观的图像会为网站增添生命力,同时也可以加深用户对网站风格的印象。

标签属性

使用HTML制作网页时,如果想让HTML标签提供更多的信息,可以使用HTML标签的属性加以设置。其基本语法格式如下:

<标签名 属性1="属性值1" 属性2="属性值2" …> 内容 </标签名>

在上面的语法中,

1.标签可以拥有多个属性,必须写在开始标签中,位于标签名后面。

2.属性之间不分先后顺序,标签名与属性、属性与属性之间均以空格分开。

3.任何标签的属性都有默认值,省略该属性则取默认值。

采取键值对——key="value" 的格式

比如: <hr width="400" /> 表示:设置 属性:宽度 、值:400

图像标签img

HTML网页中任何元素的实现都要依靠HTML标签,要想在网页中显示图像就需要使用图像标签<img>。

其基本语法格式如下:

<img src="图像URL" />

img标签的几个常用属性、属性值及属性描述:

属性 属性值 描述
src URL 图像的路径
alt 文本 图像不能显示时的替换文本
title 文本 鼠标悬停时显示的内容
width 像素 设置图像的宽度
height 像素 设置图像的高度
border 数字 设置图像边框的宽度

 

 1 <!--举个栗子-->
 2 <!DOCTYPE html>
 3 <html>
 4 <head>
 5 <meta charset="utf-8" />
 6 <title>Doument</title>
 7 </head>
 8 <body> 基本图像插入方式<br />
 9 <img src="img/logo.png"/><br />?
10 alt属性<br />
11 <img src="img/logo1.png" alt="这是我的小logo!"/><br />?
12 title属性<br />
13 <img src="img/logo.png" title="我是一个logo~~"/><br />?
14 width/height属性<br />
15 <img src="img/logo.png" width="300"/><br />?
16 border属性 <br />
17 <img src="img/logo.png" border="10"/><br />
18 </body>
19 </html>

 

技术分享图片
 
技术分享图片 

注意:

    • src属性用于指定图像文件的路径和文件名,他是img标签的必备属性。
    • URL指存储图像的位置,可以是本地计算机上的图片地址,也可以是互联网上图片的地址。
    • 一般情况下由于图片会自动等比缩放,强行设置宽高会使页面失真,因此通常,宽和高设置一个就够了。

图像标签&&标签属性

原文:https://www.cnblogs.com/Jun--/p/html_img.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!