I want to display the compound letter ̤̫ 」 so that it can be seen on the rabbit's face.

Asked 2 years ago, Updated 2 years ago, 97 views

Environment
OS:OSX El Capitan 10.11.6
Safari: 9.1.2 11601.7.7
Chrome: 55.0.2883.95 64-bit
https://codepen.io/technuma/pen/BpBRjZ

<h1>b̫rarabbit ̤̫ &</h1>

character codes:UTF-8
Characters you want to display: ̤̫ <
The codepen above is Mac

·When opening with safari
 US>Normal looking

·When opening with chrome
 garbled characters

This is the state of

How can I solve this problem?

html google-chrome safari font

2022-09-30 11:14

2 Answers

The characters you include in the title (make sure the links in the body are not supplementary information so that the question makes sense without looking at the link) are a combination of three Unicode code values:

U+164F CANADIAN SYLLABICS CARRIER SO

U+0324 COMBINING DIAERESIS BELOW

U+032B COMBINING INVERTED DOUBLE ARCH BELOW

As I know that you may not be able to read due to environmental dependence, it would have been better to write the character code in the body of the question (at least to the person who checked the source).

̤̫ <

&#x164F;&#x0324;&#x032B;

How these non-standard composite characters are drawn is entirely environmentally dependent, and there may be three tofu lines, such as the Mac version of Chrome, or there may be three unsynthesized characters next to each other.

If you really want to use three characters to display emoji-style characters (environmentally independent), you will have to write them as separate characters without using composite characters and then use CSS to intentionally overlap them.

span.first{
    display:inline-block;
    position:relative;
    top:0;
    left:0;
    width: 1.2em;
    height —1.5em;
    text-align:center;
    vertical-align:baseline;
  }
  span.second {
    display:inline-block;
    position:relative;
    top —0.8em;
    margin-left: -1.2em;
    width: 1.2em;
    text-align:center;
    vertical-align:baseline;
  }
  span.third {
    display:inline-block;
    position:relative;
    font-size: 50%;
    margin-left: -2.4em;
    top:1em;
    width: 2.4em;
    text-align:center;
    vertical-align:baseline;
  }
<span class="first">#x164F;</span class="second">#x00A8;</span class="third">#x23;#x23;print>

(There seems to be a better way to do this, but the intention of writing this is to say, "You don't want to go this far, do you?")

In short, it's the same logic that some of the emojis that can be typed and displayed normally on Mac and iOS cannot be displayed on Windows.The reason Safari and Chrome work differently on the same Mac may be because HTML rendering doesn't use the entire regular text drawing engine, so it's only browser-specific (because Chrome seems to be throwing a whole text display at the system).

If you want to make it environmentally independent, remember that composite characters are useless.


2022-09-30 11:14

What language is the letter? Noto Sans Japanese, Hiragino Kaku Gothic Pro, Meiryo, MS PGothic fonts are specified but should not be Japanese characters.You should ask questions in the appropriate language rather than in Japanese.
If you improperly treat a character as if it were a figure, it would be poor instead of garbled.

Recently, you may also try to create your own web fonts and display the desired shapes by typing them into your browser, such as .
Frequently used figures such as The Icons may already be fonted and published.


2022-09-30 11:14

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.