CSS Advanced Application: Defining the Special usage of a list

Source: Internet
Author: User

Ordered unordered single label is simple, as long as you know the use of the line, but the key point I think is not to know what the label looks like, the focus is on what kind of data to use what kind of list. What kind of data is ordered and what kind of data is unordered? After reading to think, so that you can learn things, knowledge can be their own.

The definition list is special in form, and is very special, with a much smaller list of definitions than the unordered list. There are a lot of friends who haven't started using this list, so let's break down the code for this list:

<dl>
<dt></dt>
<dd></dd>
</dl>

Looking at the code above, we found that there was no <li> tag, instead, the DL, DT, DD three tags, based on the shape and the previous list we can know that the DL is a container for this list, like a box, the difference is that the box is not only a single small box of uniform standards. But there are two different things. How do we understand this DT and DD? Semantically, DT is the name, the title, and the DD is the explanation and the content. DT and DD are both boxes, and DD only corresponds to one dt above him, and cannot be either leapfrog or downward explained. When DT does not exist, then DD has no meaning, and if DT does need DD to follow, I haven't found the exact literature to illustrate this point, but with my understanding of the definition list, I think if only DT doesn't have DD in the data, then this one can't be a definition list, The direct use of UL unordered list is OK. But when there are only one or a few of them that have no DD and most have DD, then I think this form can exist.

<dl>
<dt>有序列表</dt>
<dt>有序列表</dt>
<dt>有序列表</dt>
<dt>有序列表</dt>
</dl>

This is obviously not appropriate, such a form is no sequence table, why use the definition list, from the semantic also can not make sense.

<dl>
<dt>有序列表</dt>
<dd>有序列表就是有序列的数据以列表形成组织而成的数据形式</dd>
<dt>有序列表</dt>
<dd>有序列表就是有序列的数据以列表形成组织而成的数据形式</dd>
<dt>这一句没有解释</dt>
<dt>有序列表</dt>
<dd>有序列表就是有序列的数据以列表形成组织而成的数据形式</dd>
</dl>

I personally think that this form is feasible. So can a DT take more than one DD? I also did not find documentation on this point, and in some well-known web sites this one dt with multiple DD is still a lot. My view is that a dt with multiple DD is OK in different circumstances, but in general I think this approach is still lacking. From the perspective of interpretation, does multiple DD indicate multiple interpretations? or explain the content to be segmented and do not need to let DD to be the mouse-catching dog. There are a number of paragraph labels that can be embedded in a DD. Moreover from the style application speaking, many DD overall loose, its design extensibility is insufficient. For example, when we want to do a click dt to hide the effect of the corresponding DD, this multi-dd approach is not so well implemented. So do not use a dt with multiple DD as much as possible in a special case, or put the content in DD, segment the paragraph label to do, the list of the order or unordered lists to show.

Or start talking, the label itself is nothing, focus on how to apply.

Related Article

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.