当前位置:  开发笔记 > 编程语言 > 正文

使表情符号更大并与文本对齐。

如何解决《使表情符号更大并与文本对齐。》经验,为你挑选了1个好方法。



1> Ben Sewards..:

您的内容应始终放在HTML标记内,这些标记可为要构建的结构组件提供上下文。在下面的小提琴示例中,我们将表情符号封装在一个span标签内,而span标签又被包装在ap标签中,用于文字内容。这样,我们可以将表情符号内容上的特定CSS定位为p标签内的垂直对齐方式,而不必处理行高。font-size CSS属性可以控制Unicode字符和字体内容。

更新1
我现在看到您正在尝试将字符转换为图像。您的jsfiddle被破坏是因为它没有使用jquery框架,并且您不必声明onLoad;而是应全部在js设置窗口窗格中进行设置。

更新2:更新了jsfiddle

示例 https://jsfiddle.net/L8a9zazh/15/

的HTML



Hello world I'm buzz



Hello world I'm buzz

的CSS

img.emojione {
  // Override any img styles to ensure Emojis are displayed inline
  margin: 0px !important;
  display: inline !important;

  height: auto;
  width: 50px;
}

p#wrong-test {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  display: inline-block;
}

span.emoji {
  font-size: 30px;
  vertical-align: middle;
  line-height: 2;
}

推荐阅读
家具销售_903
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有