zoey
点击国内主页可以让浏览速度加快哦 ~ !

调整hexo博客下markdowm的内容中的图片大小

2019-08-09 hexo 图片大小 markdowm
Word count: 424 | Reading time: 1min

由于博主是初写博,之前没写markdowm,所以不是很熟悉。然而在写的内容中需要引入一张小(图片大小)图片时,发现不管通过用”! [] ()”的形式,怎么调整,图片都是默认地沾满整个宽度,很是头疼(些微强迫症,看着特别不舒服,甚至一度成为不想接着写博的借口)。后来通过进界面f12发现,是style.css在作祟,其中有一个class吧,hr ,img{width=100%},在f12中若把这个效果勾选去掉的话,图片就不是默认铺满整个宽度了。当然其中也有一些小插曲。

以下是爬坑之后的设置方法:

删除style.css中的相关限制

这里有个小坑,我发现是style.css中hr, img{width=100%}在坏事之后,先反应过来
———“嗯,把 width=100% 删掉应该就好了吧”
事实再一次冷冰冰地打了我的脸,逻辑是没问题啊,为啥不起用??
搞半天是自己改错了文件了,在hexo搭建并使用过主题之后,默认地,会有3个地方会有style.css这个文件。。。。然而不管是publi文件夹里的,还是.deploy_git 中的都不管用,theme中的style.css都会覆盖这个配置的。。。。心塞……
对的,所以 正确方法 是(保险方法)把这3个style.css对应的位置都删除了。。。

通过”< img >”标签,写宽(高)度

1
2
3
<div align=center width=80%>
<img width=80% src="https://zoey1038569979.github.io/images/blog3/blog3_res0.png" >
</div>

效果

进入页面后可以按f12快速进开发工具模式帮助找页面的参数等问题进行debug

Author: Zoey

Link: https://zoey1038569979.github.io/2019/08/09/img_adjust/

Copyright: All articles in this blog are licensed under CC BY-NC-SA 3.0 unless stating additionally.

< PreviousPost
关于HDOJ 1014题(Uniform Generator)的理解(C/C++)
NextPost >
看板娘测试博
CATALOG
  1. 1. 删除style.css中的相关限制
  2. 2. 通过”< img >”标签,写宽(高)度
  3. 3. 进入页面后可以按f12快速进开发工具模式帮助找页面的参数等问题进行debug