WordPress modifies CSS to solve the problem of English non-stop words and automatically wraps Chinese and English to align both ends.

Not available in default installationfunction, sometimes a longer English word will run out of the screen. It is very simple to modify English word and sentence breaks and automatic line wrapping. Just add a few days rule in css.
First you need to install a program that can insert code in. Search for Insert Headers and Footers in the installation plug-in. After installing Insert Headers and Footers, add



Some examples of modifying CSS English word segmentation, sentence segmentation, and line breaks:
Chinese and English sentence breaking and line breaking

{ word-break: keep-all; word-wrap: break-word; white-space: pre-wrap; text-align:justify; text-justify:inter-ideograph; }

word-wrap: break-word, only works in English, using words as the basis for line breaks. white-space: pre-wrap, only works for Chinese, forcing line breaks. text-align:justify, align both ends of CSS English statements:

Disable line breaks in article content:

{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

text-overflow:ellipsis, let the extra content be expressed with ellipsis... But this attribute is mainly used in browsers such as IE.

If a single line of text exceeds 3 lines, use an ellipsis:

.text { width:800px; word-break:break-all; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

word-break: (When a word cannot be placed at the end of the line, determine how to place the word inside.)

normalUse the browser's default line wrapping rules.
break-allLine breaks within words are allowed. Force it up, and if it can't fit in, the rest will be displayed on the next line.
keep-allLine breaks can only be made at half-width spaces or hyphens. If you can’t let it go, then display it in another line. If you can’t let it go, don’t shrink back.

word-wrap: (When the end of the line cannot fit, determine whether line breaks are allowed within the word)

normalIf the word is too long, it will be displayed in a new line. If it exceeds one line, it will overflow.
break-wordWhen the word is too long, first try to wrap it in a new line. After the word wraps, it is still too long. You can also wrap the word in a new line.

white-space:

preAll spaces and carriage returns are retained, and line breaks are not allowed.
pre-wrapPreserve all spaces and carriage returns, but allow line breaks.
pre-Spaces will be merged, and line breaks are allowed.

text-align:

justifySpecifically designed for English to align both ends of English sentences

text-justify:

autodefault value. allow browserThe user determines the alignment rule to use.
distributeHandles spaces much like newspaper, suitable for East Asian documents. Especially Thai.
distribute-all-linesJustified lines work in the same way as distribute, and also do not include the last line of the two justified paragraphs. Applies to ideographic documents
distribute-center-lastNot implemented.
inter-clusterAdjust text to lines without spaces between words. This mode adjustment is used to optimize Asian language documents.
inter-ideographProvides full justification for ideographic text. He adds or subtracts ideograms and spaces between words
inter-wordAlign text by adding space between words. This behavior is the fastest way to align all lines of text. Its justified behavior has no effect on the last line of a paragraph
kashidaAdjusts text by elongating characters at selected points. This adjustment mode is provided specifically for Arabic script languages.
newspaperAlign text by increasing or decreasing the space between words or letters. is the most precise format for justifying the Latin alphabet
illustrate:Sets or retrieves the alignment used to adjust text within the object. Because this property affects text layout, the text-align property must be set to justify. This property only works on block objects. This property is read-only for the currentStyle object. For other objects can be read and written. The corresponding script attribute is textJustify.
score

Leave a Reply

Your email address will not be published. Required fields are marked *