Part IV: Making It Cool in Java

Make QR Code in Java Part IV: Making It Cool

The final style defines the main column (refer to Figure 9-5): 1 Click and drag to select the text In this example, the text reads Main column 2 Choose Insert Layout Objects Div Tag The Insert Div Tag dialog box opens 3 Click the New CSS Style button The New CSS Rule dialog box opens 4 Select the Advanced radio button 5 Type the name of your selector into the Selector field I used #main for my example 6 Choose the Define in This Document Only check box, and click OK The CSS Rule definition dialog box opens 7 Select the Box category and choose the following settings: Width: 400 pixels Float: Right

8 Select the Border category and choose the following settings, being sure that the Same for All check box is selected for each attribute: Style: Solid Width: 1 pixel (You first select Pixels from the drop-down list and then enter 1) Color: #FF0099 (You can also use the color swatch to specify any hexadecimal color, just as you would set the color for the background or text on a Web page) 9 Click OK 10 Click OK to close the Insert Div Tag dialog box, making sure that its name appears in the ID field The style is created and visible in the CSS panel, and it is applied to the text Congratulations! You have a reasonably complex CSS layout in front of you Now you need to understand a couple of strategies that are at work here: The Float attribute aligns an element in a Web page to the left or right and flows other elements around it Text wraps to the right of an element floated left, just as it does when you use the Align attribute with the <IMG> tag To make your layout resemble Figure 9-5 exactly, use the Enter (or Return) key to add space below the first line of text and then type some additional text By creating a <DIV> tag that contains the two smaller columns and setting the Padding attribute, you create the effect of white space between the borders and the content in the <DIV> tag You can experiment using this layout by adding text and other HTML, not to mention other CSS styles A <DIV> tag can contain any content you put into a Web page, so get creative! Although this layout method may seem complicated, it is incredibly powerful and loads quickly in a browser because little actual HTML code is generated This style of layout relies on positioning the block elements in relation to each other, influenced by any margin and padding settings you choose (Take a peek at the Code view to see just how little code was generated)

Dynamic HTML (DHTML) has received so much hype and attention that you would think you could do anything with it, including your laundry Well, DHTML isn t quite powerful enough to take over your domestic duties, but it

does add a range of functionality to a Web page that has been impossible with HTML alone In fact, DHTML is kind of like HTML on steroids DHTML is really about using advanced scripting techniques to create dynamic content, which is impossible with HTML alone Dynamic content means that you can create and alter page content after the page has been loaded in a browser JavaScript has been used by designers to add dynamic effects to Web pages for a while, but with DHTML you can affect the attributes of HTML tags, which means that you can create many more kinds of effects and make them happen more quickly The biggest drawback of DHTML is the same as you find with any reasonably complex Web technology: Because browsers aren t consistent about support, some cool things you can do with DHTML don t work in all browsers Testing in all the browsers you think your Web site visitors might use is important However, Dreamweaver includes features to make it easier than ever to design pages that work in various browsers DHTML is, however, much more complicated to write than regular old HTML Even HTML frames, which are complex by many Web design standards, look relatively simple when compared to JavaScript and the kind of code you have to write in order to create DHTML This area is where Dreamweaver shines: Macromedia has implemented a series of tools that let you create DHTML effects without having to be a JavaScript programmer