Hexo NexT 主题下 blockquote 文本内容超出不自动换行解决方式

最新推荐文章于 2024-06-10 14:10:50 发布
最新推荐文章于 2024-06-10 14:10:50 发布
阅读量3.5k 收藏
点赞数
分类专栏： 一些Bug
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mohon/article/details/69803130
版权

搭建GitHub Page 中，使用Hexo NexT主题，用markdown 中的 blockquote 标签圈出文本时，出现以下情况

这里写图片描述

解决办法：

修改 对应 theme下css 文件(如下路径)：

这里写图片描述

修改base.styl ,blockquote 样式下 添加 word-break: break-all;

blockquote {
  margin: 0;
  padding: 0;
  word-break: break-all;
}

效果

这里写图片描述

完美解决！

谢谢

Mohon
关注
专栏目录
html:(9):<blockquote>引用和br换行
歌谣的博客
09-22 855
<blockquote>标签，长文本引用 <blockquote>的作用也是引用别人的文本。但它是对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。 等等，上一节<q>标签不是也是对文本的引用吗？不要忘记<q>标签是对简短文本的引用，比如说引用一句话就用到<q>标签。 如想在我...
Hexo next 主题加载自定义 js 文件
qhh0205
06-02 3266
Hexo next 主题加载自定义 js 文件 为什么要配置 hexo next 主题自定义 js 文件呢？主要原因有两点： 不可靠：加载第三方站点的 js 依赖其站点的稳定性，如果第三方站点给挂了或者不维护了，那么加载的地址就失效了， 访问直接 404… 比如最近就遇到 next 主题"不蒜子"文章 PV 统计功能用不了了，Chrome 抓包发现 https://dn-lbstatics.q...
css实现强制不换行/自动换行/强制换行
燕子钨
08-29 1420
强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break:break-all; }  
p标签不换行，超出部分用...替代
楚峡云归的博客
09-04 8090
这个东西以前就做过，用的js判断字数超出改成点点点.本来一个三元运算符就能解决的 text.length>50?text.substring(0,50):text; 但是！！这次需求不一样，要求在缩放情况下仍然能够保持，这下就只能用css了 通过查阅w3c找到了几个属性，就能实现了，还没测试，不确定会有什么兼容性问题 .title{ width: 95%; // 文本强制...
hexo markdown中使用html元素自动加了换行<br> 解决
ihoudf
10-29 1574
这个问题困扰我两个小时，shit！ 最后，将html元素之间的空格删除，比如这样： <img src="https://img.shields.io/badge/build-passing-green.svg"><img src="https://img.shields.io/badge/pod-1.1.2-yellow.svg"> 而不要这样： ...
Hexo Next主题 解决公式块中公式换行问题
刘之帅
04-18 2587
问题描述 公式块内公式不能换行。 问题环境 主题：NexT 7.8.0 Released hexo： hexo-cli: 3.1.0 os: Windows_NT 6.1.7601 win32 x64 node: 12.14.0 v8: 7.7.299.13-node.16 uv: 1.33.1 zlib: 1.2.11 brotli: 1.0.7 ares: 1.15.0 modules...
hexo next主题
06-29
下载并安装Next主题后，你需要将`hexo-theme-next-master`文件夹移动到Hexo项目的`themes`目录下，然后在`_config.yml`文件中将主题设置为`next`。接着，根据Next的主题文档进行个性化配置，这可能涉及修改主题配置...
hexoNext主题添加相册
最新发布
silent_F的博客
06-10 443
最近将博客的主题换回了next主题。以前喜欢将自己的主题弄的花里胡哨的。现在反而更喜欢简单点的。改为next主题后，有些自己想要的功能没有，比如相册。在网上查了好多资料，也有人实现了，但是都比较麻烦，或者不是自己想要的效果。于是自己换了种思路，直接用html的方式实现，再加入到博客中。这样以后不管换什么主题，相册功能都可以直接移植，非常的方便。{% link 笔者效果,%}
Hexo Next主题美化归档页
silent_F的博客
11-17 560
hexo静态博客归档页美化后如下[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-SNhodaeR-1668696786555)(https://s1.ax1x.com/2022/11/03/xqsc7T.jpg)]由于笔者使用的是next主题最新版本，所以网上很多方法都没有行通。于是便记录下来，方便作者自己，也方便和我有同样问题的朋友。
Hexo博客搭建文件（next主题）
12-07
- 在Hexo博客根目录下，使用以下命令安装Next主题： ``` npm install --save hexo-theme-next ``` - 修改`_config.yml`文件，将`theme`字段设置为`hexo-theme-next`。 3. **配置Next主题** - Next主题提供了...
HTML <blockquote> 标签
wangxiaohui6687的专栏
12-04 800
标签定义块引用。 与 之间的所有文本都会从常规文本中分离出来，经常会在左、右两边进行缩进（增加外边距），而且有时会使用斜体。也就是说，块引用拥有它们自己的空间。 代码： Here comes a long quotation: This is a long quotation. This is a long quotation. This i
换行/块引用元素/描述列表
smilling sky的博客
04-11 511
1.< br>:换行 2.< hr >:水平线 3.< blockquote >< /blockquote>:块引用 用于引文 4.描述列表：< dl> < dt>< /dt> < dd>< /dd> < /dl> 用于组织术语及其定义 < !DOCTYPE html&gt...
HTML - 格式标签 - nobr、blockquote、center、dl、dt、dd、ol、ul、li标签
W_Jp - 编程爱好者
09-04 1247
这个是浏览器自动换行的，我写的可能长了点，但是我只想告诉你们，这是自动换行的。最后，我想告诉你们我的联系号码：18101801XXX 下面是nobr标签，浏览器不自动换行。 这个是浏览器不自动换行的，我写的可能长了点，但是我只想再次告诉你们，这不是自动换行的。最后，我还是想告诉你们我的联系号码：18101801XXX
html5标题标签，blockquote 引用标签，pre预格式标签
ztt0918的博客
03-21 1043
html5标题标签，blockquote 引用标签，pre预格式标签
<blockquote>标签，长文本引用
CTI技术与呼叫中心设计
10-15 952
 的作用也是引用别人的文本。但它是对长文本的引用，如在文章中引入大段某知名作家的文字，这时需要这个标签。       等等，上一节标签不是也是对文本的引用吗？不要忘记标签是对简短文本的引用，比如说引用一句话就用到标签。       如想在我的文章中引用李白《关山月》中的诗句，因为引用文本比较长，所以使用blockquote>。 语法: blockquote>引用文本 如下面例子：
HTML blockquote元素
歪脖先生的博客
04-02 1383
blockquote元素blockquote元素用于定义单独存在的引用，引用的内容可长可短，但必须来自另一个引用源。如果引用源有一个地址的话，还可以通过 blockquote元素的 cite 属性，来提供内容的引用源。可以使用任意元素来包裹被引用的内容，如使用 figure元素来包裹 blockquote元素，使用 p 元素来对引用的内容进行分段。如果要添加署名，署名应该放在 blockquo...
设置文本不自动换行
sunset的博客
07-11 3379
在一些时候我们不想使文本换行，使超出的文本以…显示这个时候就需要：设置文本不自动换行white-space:nowrap;overflow:hidden;多余的文本使用...显示text-overflow:ellipsis;...
hexo主题next override详解
05-26
Hexo是一个静态博客生成器，它提供了一些默认的主题，但是用户也可以自己开发或使用第三方主题。其中，Next是一款非常受欢迎的Hexo主题之一，它提供了丰富的功能和灵活的配置。 在使用Next主题时，我们可以通过override来修改主题的默认配置和样式。具体来说，override是指将主题的默认配置或样式文件复制到博客根目录下的/source/_data/或/source/css/override/目录下，然后进行修改。这样，在重新生成博客时，Hexo会优先使用override中的配置或样式文件，从而实现自定义主题的效果。 下面是具体的使用方法： 1. 复制配置文件到/source/_data/override/目录下 首先，我们可以通过命令`hexo config`查看当前主题的默认配置，然后将需要修改的配置项复制到/source/_data/override/目录下的同名文件中，并进行修改。例如，如果我们想修改Next主题的默认语言为英文，可以执行以下命令： ``` hexo config | grep language > source/_data/override/next.yml ``` 然后，打开source/_data/override/next.yml文件，将`language`的值修改为`en`，保存文件即可。 2. 复制样式文件到/source/css/override/目录下 如果我们需要修改主题的样式，可以将主题的默认样式文件复制到/source/css/override/目录下，并进行修改。例如，如果我们想修改Next主题的默认字体为微软雅黑，可以执行以下命令： ``` cp -r themes/next/source/css/fonts source/css/override/ ``` 然后，在source/css/override/fonts目录下，将所有字体文件中的字体名称修改为“Microsoft YaHei”，保存文件即可。 需要注意的是，override文件的命名和存放路径需要与主题默认文件一致，否则可能会导致修改无效或出现异常。同时，使用override也可能会导致主题升级时出现冲突，因此在使用时需要注意备份原始文件和谨慎修改。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值