“帮助:外部图像”的版本间的差异
(创建页面,内容为“本页面是一个'''关于如何使用外部图像'''的帮助,如果您需要插入内部图片,请参见:'''Help:图像''' == 简单语法 == 简单的...”) |
(没有差异)
|
2017年1月16日 (一) 17:05的最新版本
本页面是一个关于如何使用外部图像的帮助,如果您需要插入内部图片,请参见:Help:图像
目录
简单语法
简单的使用外部图片,可以直接将图片地址输入或粘贴指条目内(如下文)。
简单显示外部图像
直接在文中插入图片地址,即可显示图片:
https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png
效果如下:
https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png
使用模板排版外部图片
- 参见:模板:图片外链
带链接的外部图像
[http://zh.moegirl.org/ https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png]
- 注意:格式为 [链接地址(空格)图片地址]
效果如下:
https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png
带注释的外部图像
- 主条目:Template:外部图片注释
萌娘百科中有一个模板,可以让编辑者方便地为外部图片加上框架。
语法为:{{外部图片注释|图片地址|注释文字|位置(默认为右)|宽度=尺寸(默认为400px)}}
{{外部图片注释|https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png|这是萌娘百科LOGO|左|宽度=150px}}
效果如下:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" alt="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="width:150px;"/> |
这是萌娘百科LOGO |
您也可以使用这个模板的增强版{{Outer image}},详见模板:Outer image/doc。
<img>语法
<img>语法可能相对复杂,但使用这个语法可以改变外部图片大小(简单语法无法实现)等功能。
基础格式
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" />
效果如下:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" />
这种写法显示出来和#简单显示外部图片中的图片无异。
图片缩放
实现图片缩放有两种方式:定义图片宽度(width属性)或/和定义图片高度(height属性)。
使用宽度属性
如果需要一个宽度为250px的图片:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="width:250px;" />
效果如下:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="width:250px;" />
使用高度属性
如果需要一个高度为150px的图片:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="height:150px;" />
效果如下:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="height:150px;" />
同时使用
同时定义高度和宽度可以实现拉伸图片的效果。
- 注:宽度属性和高度属性没有先后顺序之差别,即“先写宽度后写高度”和“先写高度后写宽度”没有差别。
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="height:300px;width:500px;" />
效果如下:
<img src="https://img.acg.moe/common/8/87/2010-DEC-13MoeGirlWikiLogo.png" style="height:300px;width:500px;" />
- 注意:通常过大的图片不应该放置在条目正文内,这会不方便读者浏览。大多数图片的宽度应大约位于100至400像素之间,所以在设定图片大小时,数值不应超过这个范围。
- 另外请注意,强行放大图片会使分辨率下降,这因为我们要求图片变成500像素宽,但图片的实际大小并没有500像素宽,因此浏览器的排版显示器便要将图片强制扩大至500像素宽,其显示效果便会较差了。所以切记永不依照这个方法来放大图片。
其它属性
<img>语法还有其它的属性可以选用:
属性 | 值 | 描述 |
---|---|---|
src | URL | 必须使用。规定显示图像的URL。 |
height | pixels % |
定义图像的高度。 |
width | pixels % |
设置图像的宽度。 |
alt | text | 规定图像的替代文本(当图片无法显示时,显示文本内容)。 |
title | text | 鼠标滑过时显示的文字提示。 |
longdesc | URL | 指向包含长的图像描述文档的URL。 |
ismap | URL | 将图像定义为服务器端图像映射。 |
usemap | URL | 将图像定义为客户器端图像映射。 |
- 各属性详细资料请参见参考资料。
参考资料与注释
- http://www.w3school.com.cn/tags/tag_img.asp 《HTML <img> 标签》
- 更多图像模板参见分类:圖像維護模板