登录 注册

登录

  1. 论坛
  3. Joomla! CMS 相关讨论
  5. Joomla! 核心相关
  7. “热门文章”里的标题会自动分两行展示，有点难看，怎么破？

已解决 “热门文章”里的标题会自动分两行展示，有点难看，怎么破？

更多
2016年09月28日 22:49 #1 作者： 安之若
安之若 创建了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
站长你好！
又一个问题是，目前网站右侧用了“热门文章”“最新文章”模块，可是它们圈进来的文章标题如果比较长（11个汉字一行），就会自动分两行展示，既占空间又难看，有什么办法解决吗？

请 登录 或者   注册一个会员帐号 来参与讨论

更多
2016年09月28日 23:16 #2 作者： Joomla之门
Joomla之门 回复了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
Joomla 核心自带的“热门文章”及“最新文章”模块不具备“截断过长标题”的功能。不过，我们可以通过 CSS 技巧来实现字串截断：

鉴于你的网站使用的是 Joomla 3 自带的 Protostar 模板，从 Joomla 3.5 开始，这个模板已经支持自定义 CSS 文件了。所以，操作方法如下：

1、在 /templates/protostar/css/ 这个目录中，新建一个文件名叫 user.css （如果已存在，就打开续写）；

2、在 user.css 文件末尾插入如下代码：
ul.latestnews li, ul.mostread li {
  list-style-image: none;
  list-style-position: inside;
  list-style-type: disc;
  overflow-x: hidden;
  overflow-y: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 93%;
}
 
ul.latestnews, ul.mostread {
  margin-left: 0;
}

然后刷新网页，看看效果是否满意。
付费下载 Joomla 3 扩展汉化版： 我要付费支持 Joomla 之门！

请 登录 或者   注册一个会员帐号 来参与讨论

更多
2016年09月28日 23:47 #3 作者： 安之若
安之若 回复了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
谢谢白站，刚才把你写的代码加入后，把93%改成了110%（因为标题字数太少了），现在看着比之前分两行舒服多了。
有没有可能当鼠标在标题上时，就能出现完整标题 呢？

请 登录 或者   注册一个会员帐号 来参与讨论

更多
2016年09月29日 00:04 #4 作者： Joomla之门
Joomla之门 回复了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
可以的。仍然通过 CSS 来实现。还是在刚才的 user.css 文件中，在末尾续写如下代码：
ul.latestnews li:hover, ul.mostread li:hover {
  text-overflow: clip;
  white-space: normal;
  width: 200%;
}
付费下载 Joomla 3 扩展汉化版： 我要付费支持 Joomla 之门！

请 登录 或者   注册一个会员帐号 来参与讨论

更多
2016年09月29日 09:34 #5 作者： 安之若
安之若 回复了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
强大。是的，可以了。谢谢！
代码是不是很难学，居然这么神奇

请 登录 或者   注册一个会员帐号 来参与讨论

更多
2016年09月29日 10:01 #6 作者： Joomla之门
Joomla之门 回复了话题： “热门文章”里的标题会自动分两行展示，有点难看，怎么破？
学之则难者亦易也。
付费下载 Joomla 3 扩展汉化版： 我要付费支持 Joomla 之门！

请 登录 或者   注册一个会员帐号 来参与讨论

  1. 论坛
  3. Joomla! CMS 相关讨论
  5. Joomla! 核心相关
  7. “热门文章”里的标题会自动分两行展示，有点难看，怎么破？