Hello everyone, I am the blogger of csdn: lqj_ myself
This is my personal blog homepage:
The latest uniapp graduation design column is also placed below:
https://blog.csdn.net/lbcyllqj/category_12346639.html?spm=1001.2014.3001.5482
Usually, I will also explain some things that you usually use in the Bilibili video,
Welcome to Bilibili:
Lu Miaoer's personal space-Lu Miaoer's personal homepage-哔哩哔哩Video
Table of contents
::selection
The pseudo::selection element targets the portion of text selected by the user. It provides a way to apply styles to selected text and customize its appearance. Here is an example:
::selection {
background-color: yellow;
color: red;
}::first-letter
The pseudo::first-letter element allows you to style the first letter of a block-level element. It comes in handy when you want to apply special formatting to the initial characters of a paragraph or heading. Here is an example:
p::first-letter {
font-size: 2em;
color: red;
}::first-line
Like ::first-letter, the ::first-line pseudo-element targets the first line of a text or block-level element. You can use this pseudo-element to apply a specific style to the start line of a paragraph or heading. Here is an example:
p::first-line {
font-weight: bold;
text-decoration: underline;
}::marker
The pseudo::marker element targets markers for list items, such as bullet points in an unordered list or numbers in an ordered list. Using this pseudo-element, you can customize the appearance of the markup. Here is an example:
li::marker {
color: blue;
font-weight: bold;
}::placeholder
The pseudo-element ::placeholder allows you to style placeholder text in input fields and textareas. By applying custom styles to placeholders, you can enhance the user experience and make it consistent with your overall design. Here is an example:
input::placeholder {
color: #999;
font-style: italic;
}::cue
The pseudo-element targets the cue text of the or element::cue. Prompt text is often used for subtitles or subtitles in multimedia content. Using this pseudo-element, you can apply styles specifically to the hint text. Here's an example: <audio><video>
video::cue {
color: white;
background-color: black;
}::grammar-error
The ::grammar-error and pseudo-elements allow you to style portions of text marked as grammatical or spelling errors, respectively. ::spelling-error These pseudo-elements can be used to provide a visual cue to the user when there is an error in the content. Here is an example:
p::grammar-error {
text-decoration: line-through;
color: red;
}
p::spelling-error {
text-decoration: underline;
color: blue;
}::backdrop
The pseudo::backdrop element is used in conjunction with the fullscreen api to customize the background behind an element in fullscreen mode. It allows you to change the default black background to a custom color or style. Here is an example:
video::backdrop {
background-color: gray;
}::target-text
If the browser supports text fragments, the CSS::target-text pseudo-element represents the text that has been scrolled to. It allows the author to choose how to highlight that part of the text. Here is an example:
::target-text {
background-color: rebeccapurple;
color: white;
}