How to set css text to be unselectable-CSS Tutorial-php.cn

Home

Web Front-end

CSS Tutorial

How to set css text to be unselectable

藏色散人

Sep 13, 2021 am 11:50 AM

css

How to set css text to be unselectable: 1. Create an HTML sample file; 2. Create a div and define the text content; 3. Set the text to be unselectable by setting the "user-select: none;" attribute. Can.

How to set css text to be unselectable

The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.

How to set css text to be unselectable?

css setting text is not optional Example:

<!DOCTYPE HTML>
<html>
<head>
<title>Creating non-selectable text using CSS</title>
<style type="text/css">
div {
margin-bottom: 20px;
padding: 10px;
background: rgba(10%, 10%, 10%, 0.3);
-moz-border-radius: 15px;
border-radius: 15px;
}
div#d2 {
-moz-user-select: none;
-khtml-user-select: none;
user-select: none;
font-style: italic;
}
</style>
</head>
<body>
<div id="d1">文字可以选择</div>
<div id="d2">文字不可选</div>
</body>
</html>

Rendering:

How to set css text to be unselectable

css setting text is not optional use user-select attribute.

user-selectAttribute introduction:

The user-select attribute specifies whether the text of the element can be selected.

In a web browser, if you double-click on text, the text will be selected or highlighted. This property is used to prevent this behavior.

CSS syntax

user-select: auto|none|text|all;

Attribute value

Value

auto Default. Text can be selected if the browser allows it.

none prevents text selection.

text Text can be selected by the user.

all Click to select text instead of double-clicking.

Related expansion:

In 1990, Tim Berners-Lee and Robert Cailliau jointly invented the Web. In 1994, the Web really came out of the laboratory.

Since the invention of HTML, styles have existed in various forms. Different browsers combine their own style languages to provide users with control over page effects. The original HTML contained only a few display attributes.

With the growth of HTML, in order to meet the requirements of page designers, HTML has added many display functions. But as these functions increase, HTML becomes more and more complex, and HTML pages become more and more bloated. So CSS was born.

Hakun Lee proposed the original proposal of CSS in 1994. At the time, Bert Bos was designing a browser called Argo, so they decided to design CSS together.

In fact, there were already some suggestions for unifying style sheet languages in the Internet industry at that time, but CSS was the first style sheet language that contained the rich meaning of "cascading". In CSS, styles in one file can be inherited from other style sheets. The reader can use his or her own preferred style in some places and inherit or "cascade" the author's style in other places. This layered approach gives both authors and readers the flexibility to add their own designs and mix in what everyone likes.

Ha Kun first proposed CSS at a conference in Chicago in 1994. CSS was proposed again at the www network conference in 1995. Boss demonstrated an example of the Argo browser supporting CSS. , Haken also demonstrated support for CSS in the Arena browser.

In the same year, the W3C organization (World WideWeb Consortium) was established. All the creative members of CSS became the W3C working group and went all out to develop CSS standards. The development of cascading style sheets was finally on the right track. More and more members were involved, such as Thomas Reaxdon of Microsoft, whose efforts eventually led to support for the CSS standard in the Internet Explorer browser. Ha Kun, Persia and others are the main technical leaders of this project. At the end of 1996, the first draft of CSS was completed. In December of the same year, the first formal standard for Cascading Style Sheets (Cascading Style Sheets Level 1) was completed and became a recommended standard by w3c.

In early 1997, the W3C working group responsible for CSS began to discuss issues not covered in the first edition. The results of the discussions formed the second edition of the CSS specification published in May 1998.

Recommended learning: "css video tutorial"

The above is the detailed content of How to set css text to be unselectable. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

A Little Reminder That Pseudo Elements are Children, Kinda.Apr 19, 2025 am 11:39 AM

Here's a container with some child elements:

Menus with 'Dynamic Hit Areas'Apr 19, 2025 am 11:37 AM

Flyout menus! The second you need to implement a menu that uses a hover event to display more menu items, you're in tricky territory. For one, they should

Improving Video Accessibility with WebVTTApr 19, 2025 am 11:27 AM

"The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect."- Tim Berners-Lee

Weekly Platform News: CSS ::marker pseudo-element, pre-rendering web components, adding Webmention to your siteApr 19, 2025 am 11:25 AM

In this week's roundup: datepickers are giving keyboard users headaches, a new web component compiler that helps fight FOUC, we finally get our hands on styling list item markers, and four steps to getting webmentions on your site.

Making width and flexible items play nice togetherApr 19, 2025 am 11:23 AM

The short answer: flex-shrink and flex-basis are probably what you’re lookin’ for.

Position Sticky and Table HeadersApr 19, 2025 am 11:21 AM

You can't position: sticky; a

Weekly Platform News: HTML Inspection in Search Console, Global Scope of Scripts, Babel env Adds defaults QueryApr 19, 2025 am 11:18 AM

In this week's look around the world of web platform news, Google Search Console makes it easier to view crawled markup, we learn that custom properties