Web page making with Frongpage design Web page pattern

Design | Web page

Technology in progress, thinking in the development of the Web page, of course, the pattern will be the fashion day by day. In the "scrolling character", "Happy Lights" has become a common today, the Web page can also be a change of tricks?

　　Make a dynamic button that changes when you point to the mouse pointer

In FrontPage, the menu command: Insert (insert) "Active elements (active unit)" "Hover Botton (Dynamic button)", you can make a dynamic effect of the button. However, this button effect is based on the Javaapplet applet, it has a slow speed, can not display the hint text, the mouse pointer can not become a hand and other shortcomings. Here's how to make a JavaScript-based dynamic button with Dreamweaver 2.0.

Before making this kind of button effect, you should first make two different pictures for each button, one is the picture that you normally want to display, and the other is the picture that you want to display when the mouse pointer rests on the button. It is best to have a regular picture name, such as two picture names are Botton.gif, Botton_1.gif.

First in FrontPage insert the first picture, and set up a hyperlink, the file saved with Dreamweaver (if familiar with Dreamweaver, you can not FrontPage "help"). Click the first picture you inserted to select it, click on the "Behaviors" window (if not shown, press F8 to display it) in the + button, select "Swip image (Swap picture)" In the menu to open the dialog box, press the "Browse" button to select the second picture, the last point " Ok "OK. In this way, a dynamic effect button is made, simple.

　　Visually edit a style sheet with FrontPage

You must have seen many on the home page there is such a link, it is not like a normal link is always underlined, when the mouse pointed up, the link text will change color and appear underline, this is the credit style sheet!

Open the HTML file you want to edit with FrontPage, using the menu command "format" "Stylesheet ... (Style ...) " Opens the Format Stylesheet dialog box, which shows the contents of the current file inline style sheet, where you can add or modify a stylesheet statement between the!--...--. If you want to add new style statements, you first enter labels such as A:link, A:hover, a:active, and a:visited, which represent the style of the links that are not accessed normally, when the mouse is near, when the mouse clicks, and when the link is accessed. Then, stop the cursor at the end of the tag and click the "Style ..." in the lower-left corner of the dialog box. (Style ...) " button to enter the Style dialog box, where you can set a variety of style properties as needed. If you want to change the style of a label, simply stop at any point in the curly braces behind the corresponding label and press style ... (Style ...) " button to modify it.

Example: When you want the mouse to move to the link, the text background turns yellow, and the text itself becomes red and without underlining. First enter the a:hover between the!--...--, and then stop the cursor at its end and press "style ..." (Style ...) " button into the Style dialog box, set the foreground color (foreground color) to red in the colors page, background color (background color) to yellow, and in the text page, set the Decoration (modifier) is "None", then OK. At this point, FrontPage has added code {BACKGROUND-COLOR:RGB (0,0,128), Color:rgb (255,255,255), text-decoration:none} to the a:hover tag, Is it easier than a self-made?

　　Make a pop-up window

There are a number of pages that, when opened, will pop up a smaller window that displays ads or some of the latest information. This pop-up window is simple to make, just insert the following code after the 〈body〉 tag of the page code:

<script language= "JavaScript" >
window.open (' url ', ' Window name ', ' attribute list ');
</script>

window.open (' url ', ' Window name ', ' attribute list ');

where "url" is the address of the HTML document displayed in the window; Window name "can be any one, but do not use Chinese;" A property list is a comma-separated string of individual property values that determines the appearance and status of the pop-up window. Common properties are:

Toolbar (whether the toolbar is displayed), location (whether the address bar is displayed), directories (whether a common link is displayed), status (whether the status bar is displayed), menubar (whether a single display is displayed), scrollbars (whether to use scroll bars), Resizable (whether the size can be changed), these property values equal to 1 means yes, equal to 0 or no if this attribute is not added to the list. In addition, there are width (window width), height (window height), top (the distance from the screen), and left (the distance from the screen) to control the size and position of the pop-up window.