HTML Tutorial Tips & Tricks
The HyperText Markup Language (HTML) is used to design Web pages. HTML documents contain the text content of a Web page with special tags to alter the formatting of the text and its layout and to link images inside the page. Some tips can help streamline the process of coding HTML so you can focus on the creativity rather than the coding.
Other People Are Reading
-
Insert CSS into the HTML
-
HTML provides formatting tags for adjusting colors, styles and other parameters of Web page design. CSS is an additional tool that combines with HTML to provide greater control over formatting. At the very least, CSS allows you to experiment with certain HTML parameters more quickly so you can try different design ideas. Whereas you might normally adjust the font color of a word or sentence by typing "<font color=red>", in CSS you specify a style, such as "<font style=mystyle>". Then, you configure "mystyle" separately. A particularly time-saving feature of this tip is that you can instantly change the color and other settings of all text in a single page or multiple pages by simply editing the "mystyle" attributes. At the top of the HTML document, the "<head>" section, create the "mystyle" parameters by typing:
<style type="text/css">
font.mystyle {color:sienna;}
</style>Whenever you change the color inside this piece of CSS code, the HTML will render all instances of the "mystyle" font with the new color. You can add many formatting parameters inside the single "mystyle" setting to control many design details quickly. Without this tip, you would instead have to manually change the font settings for every paragraph or instance where the color was used.
Gradient Backgrounds
-
All HTML pages have a background. It may just be a solid color or the default white or gray supplied by the Web browser. Some Web pages use images. Incorporating an image is challenging as you have to make sure that it does not visually interfere with the text on the screen. Additionally, images may need to be stretched or repeated to fill up the entire space behind a Web page. The alternative of a solid color is not always attractive. If you wish to provide a more interesting background, consider a color gradient that fades between two colors. Add this to the "<body>" tag:
<body style="filter:progid:DXImageTransform.Microsoft.Gradient(endColorstr='#C0CFE2', startColorstr='#FFFFFF', gradientType='0');">
Use whichever two colors you wish in place of the colors "#C0CFE2" and "#FFFFFF" in this code. This tip ensures you have rich backgrounds that do not require extensive image manipulation.
-
Use an HTML Color Chart
-
HTML recognizes many standard words for color formatting, such as "red," "blue" and "yellow." But thousands of colors are available when creating HTML code, and they are formatting using special color codes. While some software programs automatically enter these values, it is useful to have easy access to an HTML color chart when you are coding pages yourself. You can quickly identify interesting shades and simply use the color code provided. Many HTML color charts are available online. They all provide similar information. Find one that suits your taste and bookmark it for quick easy access during your design work.
-
References
Resources
- Photo Credit www and internet image by mbs from Fotolia.com
More Like This
Comments
-
madytv
Jun 06, 2010
hi, i need help in creating an embedder for iframe for my website, can anyone help ? please reply if yes.
