Summary

Topic 1 Insert images into web pages

Inserting images into web pages at will may create copyright issues. Putting images in a separate folder can help with organization. The code img represents the image, and src represents the source of the image. Generally, the source is from the website. alt can be used to describe pictures. If the network is not good, this text will be displayed. The title allows the user to display the text of the image when the user hovers the mouse over the image. You can set the height and width of the image in html. Align the image to the left or right.

Topic 2 Change page layout

For web pages that do not have a specific page layout, the flow is normal and the position is static. For web pages with relative positions added, their positions are relative. Absolute positioning allows text to break out of normal flow and no longer affect the position of other elements. Fixed position allows text to be fixed in the browser's position. You can use z-index to keep elements from overlapping each other. Use float elements to wrap text around floating text. The properties of the float can be set individually.

Topic 3 The layout of the web page should change accordingly

Different visitors will have screens of different sizes displaying different amounts of information. Web design should cater to all screen sizes. Liquid layout uses percentages to determine the width of each box. Grids help create professional and flexible designs. Different grid layouts should be used for different sizes of interfaces. The 960 pixel page has a 12 column grid, each grid pixel is 60px.