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

How to hide the css code from the hyperlink text

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

Share

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

This article mainly explains "how to make hyperlink text hide css code". Interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn how to hide the css code from the hyperlink text.

Let the text in the hyperlink hide the css skills and layout method.

Sometimes divcss page layout, the use of hyperlink a tag, but the need to hide the text, but the hyperlink does not fail. For example, the hyperlink of the picture or icon, using the picture or icon as the background picture, uses the hyperlink a plus text, but does not want the text to be displayed, and the hyperlink can be clicked on. The picture can also see that this time is to hide the hyperlink text.

Use the CSS attribute word: text-indent

Text-indent introduction:

Text content indentation attribute is commonly used to indent two words at the beginning of a paragraph, such as setting text-indent for each paragraph indented by two Chinese characters.

Hiding is also achieved by text-indent, such as setting text-indent:-999px or text-indent:-9999px to make the text within the object indent 9999px to achieve the hiding effect.

Examples of css layouts with text hiding in hyperlinks are as follows:

1. Case code

Online demo with text hiding in hyperlinks

.logo {margin:0auto;width:175px;height:51px

Background:url (phplogo.gif) no-repeat00}

.logoa {display:block;width:100%;height:100%;text-indent:-9999px}

Php Chinese website

Set a class=logo box, set thinkcss's website logo as the background image, and set the width and height.

First of all, the ".logo" selector sets the css width, css height and logo image as the background

Then set the hyperlink a within the class=logo object to form a block (let the hyperlink a width and height take effect), set the width and height, and set text-indent:-9999px to hide the text in the hyperlink. Of course, the text is hidden, but the hyperlinks and background images are retained.

At this point, I believe you have a deeper understanding of "how to hide the css code with hyperlink text". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

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