Get the App
SLTechnology News&Howtos  ›  Development  › 

How to change the background color of Chinese text by CSS

Shulou Source: shulou.com Published: 2022-06-01 13:07:54 09月28日 Update

This article mainly introduces the relevant knowledge of "how to change the background color of Chinese text by CSS". The editor shows you the operation process through an actual case. The method of operation is simple and fast, and it is practical. I hope this article "how to change the background color of Chinese text in CSS" can help you solve the problem.

1. Disable the text of an element (element) selected by the user

Using the attribute user-select and setting its value to none, we can set the text of an element so that it cannot be selected by the user.

Element {- webkit-user-select: none; / * Safari * /-ms-user-select: none; / * IE 10 + and Edge * / user-select: none; / * Standard syntax * /}

You can use this attribute when you do not want the original content of an element to be copied.

two。 Change the background color of the selected Chinese text

Use the selector:: selection to change the background color of the selected text:

:: selection {color: # ececec; background: # 222831;}

When you use this property, pay attention to using a good combination of color contrast.

3. Wrap text without using br

Use the property white-space and set its value to pre-wrap or pre-line:

Element {white-space: pre-wrap; / * pre-wrap*/ white-space: pre-line; / * pre-line*/} 4. Set the spacing between words

This might be a little easy for you. But I didn't know about this setting until I searched for this requirement.

You can use the word-spacing property to set the interval between words in the text.

Element {word-spacing: 6px; / * word spacing wow such * /} 5. Hide the ugly scroll bar in the browser

I didn't even know it could be done.

To do this, you must prepare different code for different browsers:

/ * Hide scrollbar for Chrome, Safari, and Opera * / html::-webkit-scrollbar {display: none;} / * Hide scrollbar for IE and Edge * / html {- ms-overflow-style: none;}

If you disable the scroll bar, you need to be sure to provide up / down buttons and other convenient navigation options. Note that Firefox has stopped its support for scroll bar hiding problems, and the above code seems to be a trick to perform the same functions as the other code I include.

This is the end of the content about "how to change the background color of the Chinese text by CSS". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Tags: Text color background attributes differences code elements knowledge between content browser user industry problem browsing original practical same good ugly Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Shulou Tech Info Linux MariaDB OPPO Reno Shulou Technology