HTML基础——网站图片显示页面

news/2024/5/13 23:43:12/文章来源:https://blog.csdn.net/anjiukonghe77852/article/details/102312204

1、图片标签

  <img />

  属性:
    src:指的是图片显示的路径(位置)
      绝对路径:D:\Pictures\Saved Pictures
      相对路径:
          ①同一级:直接写文件名称或者./文件名称
          ②上一级:../文件名称
          ③下一级:写上目录名称/文件名称
      width:指定图片的宽度,取值可以是像素值,也可以是百分比
      height:指定图片的高度,取值可以是像素值,也可以是百分比
      alt:当图片无法正常显示的时候给出的提示信息(该属性的显示效果与浏览器以及浏览器版本有关)

2、首先准备两张图片放在img文件夹下,如图:

代码如下:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>网页图片显示页面</title>
 6     </head>
 7     <body>
 8         <img src="../img/logo2.png" width="260px" height="45px" alt="logo图片"/>
 9         <img src="../img/header.png" width="300px" height="45px" alt="header图片"/>
10     </body>
11 </html>

运行效果如下:

3、如果图片放在案例二:网站图片信息文件夹下,相对路径直接写路径名,src="logo2"

如果图片位置和路径不一致,图片则不能正常显示,会显示alt里的内容,如下:

转载于:https://www.cnblogs.com/cxq1126/p/7366522.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_872355.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

HTML基础——网站友情链接显示页面

1、列表标签  有序列表&#xff1a;type默认是1,2,3……&#xff0c;reserved指降序排列      <ol type"I" start"" reversed"reversed">        <li></li>      </ol>   无序列表&#xff1a;typ…

HTML基础——网站首页显示页面

1、表格标签&#xff1a; border设置边框&#xff0c;align设置位置(居中等)&#xff0c;bgcolor设置背景颜色&#xff0c;cellspacing设置边框之间的空隙&#xff0c;cellpadding设置边框与里面内容的间距。 table表&#xff0c;tr行&#xff0c;td单元格 <table border&qu…

HTML基础——网站后台显示页面

1、框架集标签&#xff1a;&#xff08;作用&#xff1a;将页面进行区域的划分)   <frameset rows"" cols"">     <frame src""/>     <frame name""/>   </frameset> 属性&#xff1a;     …

HTMLCSS——网站注册页面

1、表单标签 所有需要提交到服务器端的表单项必须使用<form></form>括起来&#xff01; form 标签属性&#xff1a; action,整个表单提交的位置(可以是一个页面&#xff0c;也可以是一个后台 java 代码) method,表单提交的方式(get/post/delete……等 7 种) Ge…

HTMLCSS——使用DIV和CSS完成网站首页重构

1、DIV 相关的技术   Div 它是一个 html 标签&#xff0c;一个块级元素(单独显示一行)。它单独使用没有任何意义&#xff0c;必须结合CSS来使用。它主要用于页面的布局。 Span 它是一个 html 标签&#xff0c;一个内联元素(显示一行)。它单独使用没有任何意义&#xff0c;必须…

自己动手搭建一个简单的网站

我准备搭建一个属于自己的网站&#xff0c;一方面是了解建站的知识&#xff0c;另一个方面是为了测试Http请求相关的内容。 建站资料 下面是建站需要的资料: 服务器&#xff1a;也就是高级一点的电脑&#xff0c;它主要用来存放网页数据&#xff1b;web服务器&#xff1a;就…

Linux中关于HTTP协议网站的搭建和https网站简单的文件编辑

[rootlocalhost httpd]# vim /etc/httpd/conf.d/vhosts.conf 在这个文件中进行编辑 <Directory /www> AllowOverride none Require all granted 这个表示访问这个网站&#xff0c;不允许被覆盖&#xff0c;任何人可以访问 <Directory /usr/local/student> AuthTy…

Tomcat之web应用的部署和网站目录的映射

&#xfeff;&#xfeff; //注&#xff1a;$CATALINA_BASE表示Tomcat安装的目录&#xff0c;后面你会看到 //前半部分为分析&#xff0c;后半部分为实战 //CATALINA -->一个好听的名字:卡特琳娜 什么是web应用的部署和网站目录的映射?说白了就是如何让用户访问到我们开发…

xml+xslt+css+php 快速构建可扩展网站

作者:庞帆 shineyearmsn.com shinepfgmail.com 版权:新浪网技术中国有限公司 参考:http://www.beigechina.com 1.让数据与显示分离 test.xml 数据: <xml> <title>test title</title> <content>test content</content> <top>banner</top…

小公司如何部署实施Linux集群网站

其实在许多小公司和小企业里&#xff0c;尤其是牵涉到电子商务和电子广告类的网站&#xff0c;他们的网站也要求作负载均衡高可用的Linux集群&#xff0c;但由于成本的制约&#xff0c;老板都会要求系统架构师设计的方案能够用最少的钱实现这个要求&#xff0c;作为系统架构师的…

双色球旋转矩阵网站

网站地址&#xff1a;http://115.29.47.28:8080/si 用户名&#xff1a;super 密码&#xff1a;abc123 网站是拿dwz做的&#xff0c;好久没搞前段了&#xff0c;做起来还是有点费劲。 有问题和意见建议大家可以来给我留言。 网站截图如下&#xff1a; 有旋转矩阵方面经验的可…

网站的搭建流程 购买域名和服务器-amp;amp;amp;gt;域名认证与备案-amp;amp;amp;gt;服务器的部署-amp;amp;amp;gt;网站的使用

第一步&#xff1a;购买一个域名&#xff0c;租用一台服务器&#xff08;ps&#xff1a;此处以阿里云为实例&#xff09; 阿里云链接&#xff1a;https://promotion.aliyun.com/ntms/act/group/team.html?groupVBLAHqWNOm&#xff08;如果失效&#xff0c;请登陆阿里云官网购买…

微信打开网站被提示已停止访问该网页该如何解决

今天早晨发现我们公司网站只要在微信和qq中打开&#xff0c;分别被微信提示&#xff1a;已停止访问该网页&#xff0c;该网站链接以及在qq上被提示危险网站&#xff0c;千万别访问,首先先看下微信中打开网址被微信拦截并提示的图: 1.网站被微信拦截已停止访问该网页的原因 不管…

Mint建站指北其之一 域名的注册备案篇

零、准备工作 3个月及以上时间的阿里云服务器 一、 域名购买 域名申请选择阿里云、腾讯云等服务商提供的注册服务即可&#xff0c;一些域名都不算贵&#xff0c;几块钱十几块钱技能搞定&#xff0c;腾讯云好像也有首年1元的域名&#xff0c;不过阿里云较腾讯云的域名多一些。…

Mint建站指北其之二 服务器远程连接篇

备案提交之后&#xff0c;我们会有十几天的等待时间&#xff0c;这些天就可以准备一下服务器的搭建了。 零、 服务器购买和准备 服务器在域名备案前其实已经需要购买了&#xff0c;要不然域名备案无法开始&#xff0c;因本篇是关于服务器&#xff0c;这里再提一句。 1.服务器…

Mint建站指北其之三 服务器环境搭建篇

上篇说到服务器远程连接&#xff0c;远程连接后我们就可以开始搭建服务器环境了。 零、 准备工作 官网下载JDK、Tomcat、MySQL&#xff08;以上均为Linux版&#xff09; 笔者一开始使用的是甲骨文新推出的JDK-11&#xff0c;虽然运行没问题&#xff0c;但后来在Windows平台安装…

Mint建站指北其之四 网站的打包上传篇

OK,网站审批、环境搭建都弄好了&#xff0c;这时候就要编写网站了。 当网站编写完成&#xff0c;我们可以开始上传了。 零、准备工作 编写并测试好的网站、搭建完成的服务器 一、打war包 以idea为例&#xff1a; 点击File→Project Structure→Artifacts&#xff0c;进入Ar…

Mint建站指北其之五 网站的端口配置篇

最后&#xff0c;我们再对网站的访问端口和tomcat服务器进行一下配置。 一、配置tomcat 使用Xftp6打开tomcat目录下的conf/server.xml文件。 修改Connector节点下的属性”port“的值为”80“&#xff08;默认是“8080”&#xff09;。 在Host节点下新增一行配置&#xff1a; …

Mint建站指北其之终 终篇 吹响吧上低音号

呀&#xff0c;终于结束了&#xff0c;从萌生建站的想法到真正完成前前后后差不多一个月&#xff0c;一点点学&#xff0c;一点点做&#xff0c;才意识到学习靠的是不懈的坚持与努力。当初觉得建站好繁琐&#xff0c;甚至不想下手&#xff0c;慢慢地去做了才体会到其实没有什么…

升级主机PHP版本前如何确定你的wordpress网站兼容要升级的PHP版本?

原文&#xff1a;https://wpbuffs.com/wordpress-php-version-check/ If you notice that your WordPress hosting provider is not running PHP 7, but has it available to its users, you may want to consider making a WordPress PHP version change so you can benefit …