HTML5之img标签

1.语法结构

<img src="图片路径" width="" height="" alt="" />

2.img的属性

src属性：必要属性，指定图片的来源和路径
alt属性：当图片无法显示时替代文字
width、height属性，指定图片的高度和宽度，单位是像素或者百分比。
title属性：属性值是字符串。

代码示例：

<!DOCTYPE html>
<html lang="zh-cn">
<head><meta charset="UTF-8"><title>less07 img</title>
</head>
<body><h1 align="center">扣扣头像</h1><hr><p align="center"><img src="小耳朵.jpg" alt="小耳朵" width="200" height="200" title="小耳朵"><img src="man.jpg" alt="man" width="200" height="200" title="man"><img src="夏目.jpg" alt="夏目" width="200" height="200"><img src="美女.jpg" alt="美女" width="200" height="200"></p></body>
</html>

效果图：

注：图1图2使用了title属性，当鼠标放在这两张照片上会出现title中的内容。

HTML5之img标签相关推荐

HTML5语义化标签综合基础案例,HTML5语义化标签综合案例
HTML 标签声明必须是 HTML 文档的第一行,位于标签之前. 声明不是 HTML 标签:它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令. 请始终向 HTML 文档添加 ...
php video标签使用方法,HTML_HTML5 video标签（播放器）学习笔记（一）:使用入门，近有在学习html5中video标签（播 - phpStudy...
HTML5 video标签(播放器)学习笔记(一):使用入门近有在学习html5中video标签(播放器)的使用,这里做一些学习笔记,方便自己查阅和记录,本文是第一篇,将介绍的是使用该标签初始化该做 ...
移动前端html5 head 头标签
移动前端不得不了解的html5 head 头标签 2015-01-11 01:04 7965人阅读评论(2) 收藏举报目录(?)[+] 本文主要内容来自一丝的常用的 HTML 头部标签和百度FE ...
html5语义化布局分割代码,HTML5语义化标签布局的兼容性.html
html5语义化标签布局兼容性调整 header, section, footer, aside, nav, main, article, figure { display: block; } bod ...
php中文歌词,详细介绍HTML5使用Audio标签实现歌词同步的效果
HTML5的最强大之处莫过于对媒体文件的处理,如利用一个简单的vedio标签就可以实现视频播放.类似地,在HTML5中也有对应的处理音频文件的标签,那就是audio标签.通过本文给大家介绍HTML5使 ...
HTML5 的知识分享（二）：HTML5 的常用标签
经过我的上一篇博客可以让大家简单地了解了一下 HTML5 的基础标签,现在再和大家分享一下 HTML5 的常用标签吧基础标签与常用标签的主要区别在于:要先有基础标签的基础才可以灵活的使用常用标签. ...
HTML中的camera标签,详解HTML5 使用video标签实现选择摄像头功能
详解HTML5 使用video标签实现选择摄像头功能 1. html // jquery reference // // Open WebCam Snap Photo 2. javascript El ...
[转] 移动前端不得不了解的HTML5 head 头标签
HTML的头部内容特别多,有针对SEO的头部信息,也有针对移动设备的头部信息.而且各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,有很多差异性.移动端的工作已经越来越成为前端工作的重要内容 ...
body onload 控制窗口大小 html,HTML5 对各个标签的定义与规定：body的介绍
HTML5 对各个标签的定义与规定:body的介绍 2019年07月25日 | 萬仟网IT编程 | 我要评论本文主要介绍body标签... 12-06-21 body元素就是就是html文档的主内容 ...
php中的ol标签,html5中ol标签的用法详解
这篇文章主要介绍了详解HTML5中ol标签的用法,是HTML5入门学习中的基础知识,需要的朋友可以参考下定义和用法标签定义有序列表. HTML 4.01 与 HTML 5 之间的差异在 HTML ...

HTML5之img标签

HTML5之img标签相关推荐

最新文章

热门文章