The reverse import of Fireworks mx to Web pages

Source: Internet
Author: User
Tags format
Web page when you see a beautiful website, do you ever want to study how it was made? Now fireworks MX provides such a magical feature that it can import HTM or HTML-formatted Web page files and generate them as a single graph. In fact, fireworks output page of the reverse operation, you can be convenient for everyone in the PNG format source file changes when the site page.

Theoretically, as long as you can view this page normally, you can turn this page into an editable picture format for reprocessing. However, in the actual operation, we found that some large professional web site pages because their HTML code has been optimized processing, so there will be an error in the import (as shown in Figure 1).

But the idea of this one feature is already well worth our excitement, and we can use it to help us analyze and learn a lot of good pages. Of course, if the imported HTM page was originally generated by fireworks, fireworks MX could restore it in a little bit.

Let's take a look at how to use this magical feature:

  Step 1:
Open Fireworks MX, create a new graphics file, the size of the file may be set to a larger, such as 700*700. Then use the menu command file-importto open the Import dialog box (Figure 2).

  Step 2:
In the Open Import dialog box, select the HTM file (shown in Figure 3) that has been cut out in the article in the Fireworks MX production pull-down menu .

  Step 3:
Click OK button, we return to the work area, at this time can find the mouse has been changed from the arrow form to a right angle sign. Move the mouse to the upper-left corner of the graphics area, press the left mouse button to drag the mouse, there will be a dotted box, representing the imported HTM file generated graphics size (Figure 4).

  Step 4:
Release the mouse and we will see the resulting picture effect (Figure 5).

The effect is exactly the same as the original picture, and the area of the cut is exactly the same.

  Step 5:
Further check to see if fireworks MX is completely unchanged and convert the page into an editable picture. Remember in the previous section we made a Drop-down menu effect on this page? Select pointer Tool on the toolbar, click on the cutting area on the cilck on the graph, my god! pull-down menu appears! We can even continue to edit it (Figure 6).

  Step 6:
Using the menu command File-save as, open the Save As dialog box to save the graphic in PNG format. So we have the source file for this page (Figure 7).

Macromedia Company is always able to use its original idea, strange perspective to give us some amazing features, in this article we see the HTM import function is the representative. With this feature, we can easily turn the Web file into a PNG graphics file, not only to facilitate our work, but also for us to learn some good site design is very beneficial. Unfortunately, this feature is not perfect now, and for the optimized web file, we hope to improve on the future version of fireworks.

  Practice:

1 Use fireworks MX to import some HTM files to see what the effect is different.

  Tips:

When you import the HTM page you should be aware that not only should you have this HTM page file, the graphics files used on this page should also be owned so that fireworks MX can combine them to form a finished graphics source file.

Turn from: Dynamic Network production guide www.knowsky.com

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.