汉字着重号的网页实现

忘忧 2022年09月09日 366次浏览

汉字着重号的网页实现

<span class= 'focus_on'>中文符号</span >
无换行着重符号

image

带颜色 符号 更换类名即可 默认为黑色

颜色 类名
黑色 focus_on
红色 focus_on_red
绿色 focus_on_green
橙色 focus_on_orange
黄色 focus_on_yellow
蓝色 focus_on_blue
紫色 focus_on_purple
.focus_on{
  text-emphasis: black open ;
  -webbit-text-emphasis:black open;

  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_red{
  text-emphasis: red open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_green{
  text-emphasis: green open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_orange{
  text-emphasis: orange open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_yellow{
  text-emphasis: yellow open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_blue{
  text-emphasis: blue open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}
.focus_on_purple{
  text-emphasis: purple open ;
  -webbit-text-emphasis:black open;
  text-emphasis-style:'●';
  -webkit-text-emphasis-style:'●';
  -webkit-text-emphasis-position: under;
  text-emphasis-position: under;
}