Quick CSS navigation menu Creation

Quick CSS navigation menu Creation As the concept of Web Page standardization is deeply rooted in the hearts of the people, more and more websites adopt the CSS architecture. CSS architecture web pages not only comply with W3C standards, but also very beautiful. Standard Web pages start with beautiful CSS menus. As we all know, the CSS menu is written with a piece of code and code to generate beautiful menus. Today we will introduce you to a small software: CSS Tab Designer!

CSS Tab Designer is a visualization software that uses CSS to design navigation menus. The software has over 60 built-in styles. You only need to modify the existing style templates to quickly generate CSS menus. In particular, the XHTML code generated by the software strictly follows the webpage standards. The created CSS menu is compatible with various mainstream browsers, whether it is the built-in Internet Explorer, or Firefox, Opera, and Netscape.

CSS Tab Designer is easy to operate. The main interface adopts a three-column layout: Project (Items), style (Tab Styles), and Preview, almost all operations are completed on the main interface ,.

The procedure for creating a menu is very simple. You have premade more than 60 menu Styles in different Styles in "Tab Styles". Select the desired style first, next, click "Fill with samples" in "Items" on the left, and you can see the effect in "Preview" immediately, even if the menu is generated.

Of course, the menu items in the built-in style templates are all in English and are not suitable for Chinese users. We still need to make some modifications. The current menu item is displayed in "Items (Items)" on the left side of the main window. Multiple buttons are arranged in the item toolbar, from left to right: Add Multiple Items) add Item, Delete Item, Move Up, Move Down, Edit select Item ),.

Double-click any current project to enter the edit dialog box. Here, we can change the original English to the required Chinese ,.

After modifying all the content, you can see the effect in the preview area. At this point, we found that the text on the menu is not the expected Chinese, but garbled characters. Why ?.

CSS Tab Designer is an English software with preset encoding for English webpage. Therefore, we need to manually change the encoding to Chinese. Because the software itself does not have the code editing function, we will make modifications after the CSS menu webpage file is generated.

You can right-click the blank area in the preview area and select "encoding> Simplified Chinese (gb2312)" from the right-click menu. The preview effect is normal ,.

Unconsciously, the CSS menu is ready, and then the file is output. Click the "Create HTML (Generate HTML)" button on the software toolbar to go to the Save dialog box. In this example, select the Save Folder: D: \ web, enter the file name: menu, and click "save.

As mentioned above, the web page code generated by the software is in English by default. Next, let's start to modify the code.

Enter the D: \ web directory, and you can see two files:

The CSS menu page generated by menu.html.

Menu1.gif, CSS menu call related images, the actual file name may be slightly different.

You can open the menu.html file with an editor in any of the following ways:

CSS Tab Designer generates the default file encoding is "ISO-8859-1", modify to Chinese encoding "gb2312,

This is simple. Save the Modification result and open menu.html again. How can this problem be solved? There is no garbled code!