Using The Div Element In Css Page Layout-www.44fang.com

Software The key requirement in CSS web page layout is positioning blocks of content in different parts of the browser window. The key HTML element used to achieve this is the DIV element (short for DIVISION). The DIV element is pure vanilla: it has no inherent properties or sub-elements (unlike the TABLE element which was originally used for web page layout). It is a block element which can contain any web page content, including other DIVs. Typically, when using CSS for page layout, related elements within the HTML page are placed within the same DIV. For example, there might be a DIV containing a logo or banner, another containing navigation links, another containing the main content of the page, and so on. Another .mon practice is to place all DIVs inside an outer or wrapper DIV which acts as the overall container for the page content. Key attributes such as width and alignment can then be applied to this wrapper. Each of the main DIVs being used for page layout will normally be given a unique ID; for example, div ‘id="leftCol"’. IDs can only occur once within an HTML page and can therefore be referred to in the CSS code; for example ‘#leftCol…’. Some subordinate DIVs (i.e. those contained within the main DIVs) will share attributes with several other DIVs on the page. These will be defined as a class in both the HTML page; e.g. ‘div class=imageLeft’ and in the CSS style sheet; e.g. ‘.imageLeft…’. If you are using a wrapper DIV, as is usually the case, you will generally set its width to the overall width you want your page content to occupy. The width that you choose will depend on the typical monitor resolution used by your anticipated audience. The lowest .mon denominator is probably 800 x 600 pixels but many designers are now assuming 1024 x 768. Bear in mind that these pixel dimensions represent the entire screen. The actual web content will occupy only some of this. For this reason, designers usually use a width of 760 pixels when targeting the smaller resolution and 950 pixels when targeting the larger. In CSS, there are two basic ways of specifying the width you want your content to occupy: using a fixed measurement or using percentages. Using pixels to specify the width you want your content to occupy offers you more control over your design but it can be inconvenient for visitors to your website. If their monitors are larger than your specified width, there will be a lot of wasted space. Those whose monitors are not as wide as your content will have to constantly scroll left and right to read your pages and who can blame them if they lose patience and go elsewhere. Percentage-based design is often referred to as liquid in that the content will simply readjust to fill as much of the available space as you specify. About the Author: 相关的主题文章: