“HTML图像”的版本间差异
本页内容
(创建页面,内容为“18 使用图像可以改善网页的设计和外观。另外文本,图片,视频,是承载信息的主要载体。用好图片能让你的网站让人眼前一亮。 文件:Image.jpg”) |
无编辑摘要 |
||
第3行: | 第3行: | ||
[[文件:Image.jpg]] | [[文件:Image.jpg]] | ||
<sample title="" desc="" hererun="s"> | |||
<img src="/images/7/78/Image.jpg" alt="落日"> | |||
</sample> | |||
== 图像img语法 == | |||
<nowiki><img></nowiki>标签用于在网页中嵌入图像。只包含属性,没有结束标签。 | |||
* '''src''' - 指定图像的路径(URL) | |||
* '''alt''' - 指定图像的替代文本 | |||
* '''width''' - 设置宽度 | |||
* '''height''' - 设置高度 | |||
<sample title="语法" desc=""> | |||
<img src="url" alt="alternatetext"> | |||
</sample> | |||
<blockquote> | |||
注意:当网页加载时,浏览器会从网页服务器获取图像并将其插入到页面中。因此,请确保图像实际上与网页相关的位置保持不变,否则您的访问者将看到一个损坏的链接图标。alt如果浏览器找不到图像,则会显示断开的链接图标和文本。 | |||
</blockquote> | |||
<sample title="" desc="推荐使用style方式设置宽度和高度" hererun="s"> | |||
<img src="/images/7/78/Image3.jpg" alt="日出"> | |||
<img src="/images/7/78/Image.jpg" width="100px" alt="落日"> | |||
<img src="/images/7/78/Image.jpg" style="width:100px" alt="落日"> | |||
<img src="/images/7/78/Image.jpg" style="height:100px" alt="落日"> | |||
</sample> | |||
== GIF动画图像 == | |||
HTML允许GIF格式图片展示,你可以很方便让动图在你的网站内展示,增加能网站的视觉效果,吸引用户眼球。 | |||
[[文件:Gif.gif]] | |||
<sample title="" desc="" hererun="s"> | |||
<img src="programming.gif" alt="气泡" style="width:48px;height:48px;"> | |||
</sample> |
2022年8月4日 (四) 14:15的版本
使用图像可以改善网页的设计和外观。另外文本,图片,视频,是承载信息的主要载体。用好图片能让你的网站让人眼前一亮。
示例
<img src="/images/7/78/Image.jpg" alt="落日">
图像img语法
<img>标签用于在网页中嵌入图像。只包含属性,没有结束标签。
- src - 指定图像的路径(URL)
- alt - 指定图像的替代文本
- width - 设置宽度
- height - 设置高度
语法
<img src="url" alt="alternatetext">
注意:当网页加载时,浏览器会从网页服务器获取图像并将其插入到页面中。因此,请确保图像实际上与网页相关的位置保持不变,否则您的访问者将看到一个损坏的链接图标。alt如果浏览器找不到图像,则会显示断开的链接图标和文本。
示例
推荐使用style方式设置宽度和高度
<img src="/images/7/78/Image3.jpg" alt="日出">
<img src="/images/7/78/Image.jpg" width="100px" alt="落日">
<img src="/images/7/78/Image.jpg" style="width:100px" alt="落日">
<img src="/images/7/78/Image.jpg" style="height:100px" alt="落日">
GIF动画图像
HTML允许GIF格式图片展示,你可以很方便让动图在你的网站内展示,增加能网站的视觉效果,吸引用户眼球。
示例
<img src="programming.gif" alt="气泡" style="width:48px;height:48px;">