The system makes adjustments even for slight differences in alphanumeric characters.<\/p>\n\n\n\n
In text, it’s “I (capital I),” “l (lowercase L),” and “1 (the number one).” When generating random alphanumeric characters, letters are mixed in.<\/p>\n\n\n\n
As a workaround, it’s acceptable to design the specification for automatically generated alphanumeric candidates to “exclude specific character strings,” but it’s also strange that characters not present within the system exist.<\/p>\n\n\n\n
As a simple solution, I’ll explain how to use a font with small decorative \u201cfeet or whiskers\u201d at the ends of characters by specifying “serif” in CSS.<\/p>\n\n\n\n
\u30fbTimes New Roman
\u30fbGeorgia
\u30fbGaramond
\u30fbBaskerville
\u30fbPalatino<\/p>\n\n\n\n
The example specified in CSS is as follows.<\/p>\n\n\n\n
.element<\/span> {<\/span><\/span>\n\t<\/span>font-family<\/span>: <\/span>"Times New Roman"<\/span>, <\/span>Georgia<\/span>, <\/span>"Garamond"<\/span>, <\/span>"Baskerville"<\/span>, <\/span>"Palatino"<\/span>, <\/span>serif<\/span>;<\/span><\/span>\n}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\nThe problem is that depending on the font, the “height position of numbers” appears as a subscript. Specifying a different font for the numbers can be helpful.<\/p>\n\n\n\n
CSS<\/span>@font-face<\/span> {<\/span><\/span>\n\t<\/span>font-family<\/span>: <\/span>"Number"<\/span>;<\/span><\/span>\n\t<\/span>src<\/span>: <\/span>local<\/span>(<\/span>"Baskerville"<\/span>);<\/span><\/span>\n\t<\/span>unicode-range<\/span>: <\/span>U+0030-0039<\/span>;<\/span><\/span>\n}<\/span><\/span>\n<\/span>\n.element<\/span> {<\/span><\/span>\n\t<\/span>font-family<\/span>: <\/span>"Number"<\/span>, <\/span>"Times New Roman"<\/span>, <\/span>serif<\/span>;<\/span><\/span>\n}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\nSpecifying a range for the numbers (0 to 9) and assigning the \u201cNumber\u201d font to them. Next, we’re writing the font to be applied to the numbers first so it loads with priority.<\/p>\n\n\n\n
Numbers 0 through 9 will be displayed in “Baskerville,” while all other characters will use “Times New Roman.” After that, feel free to experiment with combining fonts to achieve your ideal look, then choose whichever works best. Please give it a try.<\/p>\n","protected":false},"excerpt":{"rendered":"
The system makes adjustments even for slight differences in alphanumeric characters. In text, it’s “I (capital I),” “l (lowercase L),” and “1 (the number one).” When generating random alphanumeric characters, letters are mixed in. As a workaround, it’s acceptable to design the specification for automatically generated alphanumeric candidates to “exclude specific character strings,” but it’s […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_locale":"en_US","_original_post":"https:\/\/touhyo.com\/blog\/?p=1315","footnotes":""},"categories":[1],"tags":[],"class_list":["post-1318","post","type-post","status-publish","format-standard","hentry","category-memo","en-US"],"_links":{"self":[{"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/posts\/1318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/comments?post=1318"}],"version-history":[{"count":7,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/posts\/1318\/revisions"}],"predecessor-version":[{"id":1373,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/posts\/1318\/revisions\/1373"}],"wp:attachment":[{"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/media?parent=1318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/categories?post=1318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/touhyo.com\/blog\/wp-json\/wp\/v2\/tags?post=1318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}