Proficient in Css+div Web style and layout--making a practical menu

In the last blog post, the main simple summary of the CSS on how to set up the page and browser elements, today's small series to continue to introduce the basic knowledge of CSS, this blog, the small part of the main simple summary of how to make a Web page in the CSS menu, which includes: Project list, No need to Table menu, menu, and so on, look at the following a mind map:

First, we look at the list of items, the list of symbols, and let's look at the example code and run the effect:

<span style= "FONT-SIZE:18PX;" ><span style= "FONT-SIZE:18PX;" >
The results are as follows:
Analysis of the above code, the body part is very simple, UL unsigned list of items, and a group of Li tags, in the CSS code, the UL is marked separately, the most important is: List-style-type:circle. This sentence indicates that the item list symbol is represented by a hollow circle. The running effect appears as shown in the film. Of course, we can also set a different display, everyone to try; Although UL displays an unsigned list, the list symbol can be set in CSS as well. Our CSS not only can make the list of symbols, we will try to try the picture symbol, example code and run the effect as shown below;
<span style= "FONT-SIZE:18PX;" ><span style= "FONT-SIZE:18PX;" ><span style= "FONT-SIZE:18PX;" >
the effect of the operation is as follows:

By comparing the two runs, we see that this is not the same as the list symbol we said above, where the picture is used as a symbol. Let's take a look at this code: the list-style-image behind the code is followed by a link to the image. For the designer of the usual HTML, the menu that was created at the beginning is often used in tables, a hyperlink is placed in a table cell, and when the UL and Li Bullets are introduced, the usual way to make a menu is to use the UL and Li tags, and we look at how the NIE is implemented. The example code and the run effect are as follows:
<span style= "FONT-SIZE:18PX;" ><span style= "FONT-SIZE:18PX;" >the effect of the operation is as follows:
When we do the Web page, sometimes we need a horizontal menu to display, and in the CSS can be very easy to change the menu. Let's take a look at the example code and how it works:
<span style= "FONT-SIZE:18PX;" ><span style= "FONT-SIZE:18PX;" >the effect of the operation is as follows:
Analysis, the above code, first of all, this body part is exactly the same as our example, the difference is only the CSS settings, you can easily implement the menu of the vertical and horizontal conversion, which is conducive to our maintenance in the later, if we need to convert the menu from the vertically to the lateral or horizontal conversion to vertical, will be very convenient, here is the Li attribute Float:left, and a property is the same as setting the border and so on. Usually in the design of the Web page, often use the Ul,li to set the menu, which is very convenient for our later maintenance.
 Small Series of words: This blog, small series continue to introduce the basic knowledge of CSS, the main simple summary of how to make a Web page in the CSS menu, this part of the content includes: Project list, no Table menu, menu, and so on, then a small example, Combined with examples of code to explain, there are different views of the small partners welcome discussion exchange, b/s study, not to be continued ...
Proficient in Css+div Web style and layout--making a practical menu