ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

在API文档中完美调整图像大小

2023-08-03 17:42:08  阅读:156  来源: 互联网

标签:API 渲染 自定义


Bump.sh如何默认渲染图像

通常,在降价中,您将使用此语法来添加图像

![Alt text](/path/to/image.jpg "Image title")

默认情况下,Bump.sh允许浏览器决定如何显示生成的html <img src="image.url">。例如,如果图像在表格单元格中,它将被限制为表格单元格的大小,如果在段落中,它将使用默认图像大小。

但是,您现在可以自己决定图像大小。

如何在API文档中自定义图像大小

现在,您可以使用a=dimension参数进一步进行个性化,该参数允许您手动决定如何在文档中显示图像。

=dimension只需通过允许您在结束括号之前提供额外的维度信息来扩展众所周知的Markdown语法

![Alt text](/path/to/image.jpg "Image title" =dimension)

例如,如果您想显示100像素高、50像素宽的图像,您可以写

![Alt text](/path/to/image.jpg "Image title" =100pxx50px)

=dimension uses the following syntax =[width][unit]x[height][unit] and is itself completely optional as well as almost all its parameters: just width or xheight are mandatory. If you don't specify width or height, the other value will be a ratio calculated from the original size of the image so it doesn't shrink.

告诉这个可能会令人困惑,所以这里有几个例子可以更好地了解你可以用这个=dimension参数做什么:

让我们拍这张海绵宝宝的毛绒照片。查看它默认呈现方式:

 

现在让我们来玩玩=dimension参数!

=100pxx50px   # with everything
=100x50     # without unit

 

=100        # without height (x separator not needed) and unit
=100px      # without height

 

=x50        # without width and unit
=x50px      # without width

 

请注意,不指定单位将回退到像素。

它还支持所有CSS长度单位,因此您可以使用像素、%或您习惯的任何其他绝对或相对单位的px

与上面相同的图像,=dimension=200cm
 

始终确保您使用的属性由不同的浏览器处理,因为它可能有所不同。

您可以在文档中找到有关此新图像大小化功能行为的扩展描述。

尝试使用您自己的API文档

Bump.sh允许您预览文档的外观。

您可以在编辑API合同时预览图像将如何呈现,或在测试中使用Bump.sh CLI命令

npm install -g bump-cli   ## installs bump.sh cli

bump preview --live --open openapi-definition.json

选项--open将在默认浏览器中打开预览,在文件中保存编辑后,--live将自动更新浏览器中的预览。

标签:API,渲染,自定义
来源:

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有