首页前端开发JavaScripthtml图片怎么插入

html图片怎么插入

时间2024-01-29 15:25:02发布访客分类JavaScript浏览346
导读:收集整理的这篇文章主要介绍了html图片怎么插入,觉得挺不错的,现在分享给大家,也给大家做个参考。在HTML中可以通过<img>标签插入图片,插入的代码如“<img src="dinosaur.jpg">”,其中sr...
收集整理的这篇文章主要介绍了html图片怎么插入,觉得挺不错的,现在分享给大家,也给大家做个参考。

在HTML中可以通过img> 标签插入图片,插入的代码如“img src="dinosaur.jpg"> ”,其中src属性包含了指向我们想要引入的图片的路径,可以是相对路径或绝对URL。

本文操作环境:windows7系统、HTML5& & CSS3版,DELL G3电脑。

我们可以用img> 元素来把图片放到网页上。它是一个空元素(它不需要包含文本内容或闭合标签),最少只需要一个 src (一般读作其全称 source)来使其生效。src 属性包含了指向我们想要引入的图片的路径,可以是相对路径或绝对URL,就像 a> 元素的 href 属性一样。

注意:在继续之前,你应该阅读快速入门URL和路径来复习一下相对和绝对URL。

举个例子来看,如果你有一幅文件名为 dinosaur.jpg 的图片,且它与你的 HTML 页面存放在相同路径下,那么你可以这样嵌入它:

img src="dinosaur.jpg">
    

如果这张图片存储在和 HTML 页面同路径的 images 文件夹下(这也是GOOGLE推荐的做法,利于SEO/索引),那么你可以采用如下形式:

img src="images/dinosaur.jpg">
    

以此类推。

注意:搜索引擎也读取图像的文件名并把它们计入SEO。因此你应该给你的图片取一个描述性的文件名:dinosaur.jpg 比 img835.png 要好。

你也可以像下面这样使用绝对路径:

img src="https://www.example.COM/images/dinosaur.jpg">
    

但是这种方式是不被推荐的,这样做只会使浏览器做更多的工作,例如重新通过 DNS 再去寻找 IP 地址。通常我们都会把图片和 HTML 放在同一个服务器上。

【推荐学习:HTML视频教程】

以上就是html图片怎么插入的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

上一篇: html如何关闭当前页面下一篇:html怎么加空格猜你在找的JavaScript相关文章 html font标签如何设置字体大小?html font标签属性用法介绍2022-05-16vue3+TypeScript+vue-router的使用方法2022-04-16vue3获取当前路由地址2022-04-16如何利用React实现图片识别App2022-04-16JavaScript展开运算符和剩余运算符的区别详解2022-04-16微信小程序中使用vant框架的具体步骤2022-04-16Vue elementUI表单嵌套表格并对每行进行校验详解2022-04-16如何利用Typescript封装本地存储2022-04-16微信小程序中wxs文件的一些妙用分享2022-04-16JavaScript的Set数据结构详解2022-04-16 其他相关热搜词更多phpjavapython程序员loadpost-format-gallery

若转载请注明出处: html图片怎么插入
本文地址: https://pptw.com/jishu/591257.html
如何解决html乱码问题 html怎么设置style样式

游客 回复需填写必要信息