Actions

About CSS page layouts

Other languages:
العربية 100% • ‎Deutsch 100% • ‎English 100% • ‎español 100% • ‎فارسی 20% • ‎français 100% • ‎हिन्दी 100% • ‎Bahasa Indonesia 100% • ‎italiano 100% • ‎Nederlands 100% • ‎Nederlands (informeel)‎ 100% • ‎português 100% • ‎português do Brasil 100% • ‎română 100% • ‎русский 100%

Professional websites separate styling from content. There are many reasons for this, the most obvious (to a developer) being the ability to control the appearance of many pages by changing one file. Styling information includes: fonts; backgrounds; images (that recur on every page); position and dimensions of elements on the page. Your HTML file will now be left with: header information; a series of elements; the text of your website. Because you are creating a Joomla! template, you will actually have: some header information; php code to request the rest of the header information; a series of elements; php code to request each module position; php code to request the main content.

Style information is coded in CSS, cascading style sheet, and usually stored in files with the extension .css. A webpage contains a link to the associated .css file so a browser can find the appropriate style information to apply to the page. CSS can also be placed inside a html file between <style type="text/css"></style> tags.

All CSS code is applied to an element of the html/xml page. If you want a style to encompass a whole page, you would probably apply it to the <body> element. You can apply styles to any html element such as <p>, <table> or <div> elements. To style a particular element it needs to have an ID. For example, to apply styles to the <div> containing the title, you would first include an ID in the html - <div ID="title">.

Advertisement