css语法学习

常青AAS

发布于 2022-02-11 15:01:01

3270

发布于 2022-02-11 15:01:01

文章被收录于专栏：常青AAS的小站

图片设置

更改长宽

![width:200px](image.jpg)
![height:300px](image.jpg)
![w:200px h:30cm](image.jpg)

图片滤镜（Image Filter）

基于 CSS 的 filter 属性，Marp 可以对图片进行一些基于模糊、亮度、对比度等的操作，如：

![blur:15px](image.png)
![brightness:0.5](image.png)
![contract:150%](image.png)

背景图片

同时通过在 bg 后追加图片的格式属性，如 [bg fit] ，可以具体设置背景图片的缩放方式。其中 cover 表示充满页面， fit 表示拉伸以适应页面， auto 为不做缩放使用原图片比例。

更改布局

背景图片布局

![bg](images/9BBDF9.png)
![bg](images/2EC0F9.png)
![bg](images/B95F89.png)

在其中一张图片后加入属性 vertical 将使图片纵向组合。

![bg vertical](images/9BBDF9.png)
![bg](images/2EC0F9.png)
![bg](images/B95F89.png)

更新图片与文字位置

有时候想左文右图，或者左图右文的布局，可以设置背景图片的位置

![bg right w:15cm](images/prometheuslogo.png)

图片加阴影`drop-shadow`

start 
if (condition A ) then (yes)
	:Text 1;
	endif
stop

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2021-08-092，如有侵权请联系 cloudcommunity@tencent.com 删除

auto

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度

css语法学习

css语法学习

图片设置

更改长宽

图片滤镜（Image Filter）

背景图片

更改布局

背景图片布局

更新图片与文字位置

图片加阴影`drop-shadow`

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

css语法学习

css语法学习

图片设置

更改长宽

图片滤镜（Image Filter）

背景图片

更改布局

背景图片布局

更新图片与文字位置

图片加阴影drop-shadow

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

图片加阴影`drop-shadow`