Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

A new tutorial on techniques and methods of CSS image replacement

2025-01-18 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

This article mainly explains the "a new CSS picture replacement skills and methods tutorial", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in depth, together to study and learn "a new CSS picture replacement skills and methods tutorial" it!

9999 px's image replacement technology has been the best part of a decade. To replace a text element and an image, you can use the following code:

The code is as follows:

This Text is Replaced

H2

{

Background: url ("myimage") 0 0 no-repeat

Text-indent:-9999px

}

The background display of the element and its text are moved off the screen so that it does not interfere. Simple and effective. It is often used to display graphic titles-it is rarely necessary for us to have webfonts now, but you will still think it uses web.

up to now.

A new technology has been discovered:

The code is as follows:

{

Text-indent: 100%

White-space: nowrap

Overflow: hidden

}

The code indent text exceeds the width of its container, but it does not wrap and the overflow is hidden.

Although this is a smaller longer and harder to remember, it can improve performance because the browser no longer draws a 9999 px box behind the scenes. It will also prevent weird left extensions that outline the use of hidden text around links you will see.

Thank you for your reading, the above is the "a new CSS picture replacement techniques and methods tutorial" of the content, after the study of this article, I believe you on a new CSS picture replacement techniques and methods tutorial has a deeper understanding of this problem, the specific use of the need for you to practice and verify. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report