If css is powerful enough, will you use Programming to Implement the existing functions of css ?, Css already exists

Source: Internet
Author: User

If css is powerful enough, will you use Programming to Implement the existing functions of css ?, Css already exists

Currently, css3 is available, but for some reasons, I have never used any styles that can be supported in css2. I feel that it is really necessary for me to calm down and look at those things to see which were previously ignored. Today, I mainly talk about three things that are often used in programming. The details are as follows.

I. Sequence Number of the ordered list
A. application scenarios

There is a list that requires serial number display to help you know the number of records in the current list. You can delete one of the records at will. After deletion, the serial number is reorganized.

B. Thinking

In the past, I did not know that a style is usually used to convert the list information to the sequence number of the current record through index + 1 during display. This method is very simple. However, it is troublesome to delete any records. You can simply remove yourself from the current jquery record. It is a headache to reorganize the sequence number. In fact, if you get used to it, you will not have a headache. I will use $. each () and use the index to achieve the effect. But our programmers are to implement the most powerful functions in the simplest way. In this way, we have more time to focus on the system business logic.

C. Learning

Http://www.w3school.com.cn/cssref/pr_list-style-type.asp

D. Note

After all, css is made by foreigners. numbers 1, 2, and 3 in Chinese cannot be implemented in this way.

E. Legend2. Display omitted characters to represent the trimmed text
A. application scenarios

In this scenario, I don't want to describe it. As we all know, if you want to display a large amount of content without trimming, the page may be deformed.

B. Thinking

In fact, we used to like to use programs, cut off strings, and splice ellipsis to display them. In general, this method basically achieves what we want. But have you ever thought about it? If we can only display 10 Chinese characters in a div with a width of PX, we can extract 9 Chinese characters and "…" When the number of strings we actually present does not exceed 10 Chinese characters, we cannot splice "…". Is it difficult to process the logic through the program? It is even more troublesome to adjust the div width to PX. The headache is that the program intercepts 19 Chinese characters. Isn't it a little annoying in an instant? The most troublesome situation is that the English letters, "I" and "M", each of them has a very different width than the other 10. I will not describe it any more. I believe I will explain the intention of this English letter.

C. Learning

Http://www.w3school.com.cn/cssref/pr_text-overflow.asp

D. Note

To achieve the captured effect, the current tag width must be fixed. Otherwise, the pruning effect may fail.

E. LegendIii. Background
A. application scenarios

Here I will use a picture to show it, but it will not be described much.

B. Thinking

In this scenario, we only encounter a small number of Chinese characters. This usually occurs in Chinese characters, but in English, like the second line above, the system recognizes it as a word, therefore, do not force line feed. But this is far from the beautiful style we want.

C. Learning

Http://www.w3school.com.cn/cssref/pr_word-break.asp

D. Note

You do not need to consider this issue within the Chinese scope. This problem occurs only when a single English word is too long. This problem is caused by our testing department. I hope you will notice this.

E. LegendSummary: this topic is mainly for two purposes. First, I hope you can look back at the knowledge you have learned. Have you missed something? Or you didn't have a deep understanding at the time; second, I hope you can look forward and see if there is a better way to replace the original clumsy implementation method. The content above is actually an old thing, but many siege lions are still implemented in the old way. Therefore, this is just an interesting role. I hope that you can master new knowledge to replace the old knowledge and review the past.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.