In addition to Weibo, there is also WeChat
Please pay attention
WeChat public account
Shulou
2025-04-07 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >
Share
Shulou(Shulou.com)06/01 Report--
Editor to share with you how to use the pseudo elements before and after in css. I hope you will get something after reading this article. Let's discuss it together.
What are:: before and:: after?
The descriptions of before and after are as follows
Element:: before {content: inserted content;}
Element:: after {content: inserted content;}
Content: enter part of the content to insert
To insert letters and symbols in content, enclose them in "" and enter them.
To insert images and sounds in content, enter url (target path).
You can also specify before and after for the same element.
Pseudo elements such as before and after in CSS3 use:: (double colons), but even with a single colon, it is recognized and works in most browsers.
Supported browsers
Browsers that support:: before and:: after pseudo elements: Chrome, Firefox3.5~, Safari4~, IE8~, Opera6~.
How to use pseudo elements before and after?
Here is a HTML file that applies before and after
(this is an example where the * html and css files are in the same directory and the external stylesheet file name is "sample.css")
HTML
Add a tag before the title
Insert an image before a paragraph
Sample.css
H4::before {
Content: "◆"
}
P::before {
Content:url (img/luffys.jpg)
}
In this example, the symbol "♦" is inserted before the title of
Insert the image file "img/luffys.jpg" before the paragraph of the
It appears on the browser as follows: the title is preceded by "◆" and an image file is inserted in front of the paragraph.
After reading this article, I believe you have a certain understanding of "how to use before and after in css". If you want to know more about it, please follow the industry information channel. Thank you for your reading!
Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.
Views: 0
*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.
Continue with the installation of the previous hadoop.First, install zookooper1. Decompress zookoope
"Every 5-10 years, there's a rare product, a really special, very unusual product that's the most un
© 2024 shulou.com SLNews company. All rights reserved.