HTML : Formatting fonts and text using CSS

Introduction Fonts are fundamental to all written communication. Fonts convey emotion, style and help your writing convey implicit meaning. For instance, if you are chatting in a chat-room or emailing someone and you type USING ALL CAPS, a common Web convention is that you are yelling. A font’s meaning can be subtle. A choice as simple as using Comic Sans rather than Arial can convey an entirely different mood. Welcome to My Site (Comic Sans) The Comic Sans font conveys a loose and informal site while Arial seems more formal. Welcome to My…Read more

HTML : More about CSS

Understanding CSS rules A CSS rule consists of two parts, the selector and the declaration. The selector determines the element(s) affected by the rule. The declaration specifies the action taken. When specifying a selector, you can narrow the affected element to only elements of a specific class or a specific id. When specifying elements of a specific class you use a period between the element and the class name. element.classname When specifying an element with a specific id you place a hash sign between the element and the id. element#id When the browser…Read more

HTML: Introduction to CSS

Cascading Style Sheets (CSS) are what you use to apply style to your HTML documents. A CSS document is a text document that contains one or more rules which tell browsers how to format the elements on an HTML page. A rule consists of a selector that specifies the element to which to apply a style and a declaration that declares which style to apply. Declaration includes two components such as: property and value. There are many CSS properties you can set, including properties for positioning and sizing elements, properties for setting an…Read more

Peep inside HTML Forms

More about HTML Forms Adding Radio Buttons A radio button is an input of type radio. You use radio buttons to select one of two or more values from a group of related choices. For instance, you might be asked to choose your favourite flavoured ice cream from the choices: vanilla, chocolate and strawberry. However, unlike a check-box, a radio button only allows you to choose one of the three. <input type="radio" name="flavor" value="vanilla" checked="checked"/> <input type="radio" name="flavor" value="chocolate"/> <input type="radio" name="flavor" value="strawberry"/> You create a mutually exclusive radio button group by setting…Read more

HTML: Building a simple form

You add a form to an HTML page using the <form></form> tags. Two common form fields are text fields and password fields. These two form fields are both input elements, where text fields have their type indicated as text and password fields as password. Password fields mask the letters as you type so nobody can observe your password when you are typing. You can specify the width of either field using the size attribute, and you can also pre-fill either field with a default value by specifying a value attribute. <input type="password" name="passOne"…Read more

HTML: More about tables and HTML forms

More about Tables:Specifying column spans and row spansTable cells can span multiple columns and/or multiple rows. The columnspan (colspan) attribute tells the browser how many columns a data cell should use and the rowspan the number of rows. These two attributes are important if you want visually appealing tables.Note that when you specify a colspan of more than one, you must omit a <td></td> for every column spanned in the row. When spanning rows, you omit a <td></td> for each row that is being spanned.Specifying a table’s header, body and footerYou can specify…Read more

HTML : More about tables

In the last articles we discussed some of the fundamentals about the tables in HTML. In this article we will be discussing more about them. So let’s start with spacing and padding in HTML tables. Adding padding and spacing to table cells You can also specify a cell’s spacing and padding. Padding is the space between the cell’s content and the cell’s border. Spacing is the space between adjacent cell’s borders. Cell padding and spacing can be given either pixel values or percentages. <table cellpadding="5" cellspacing="10%" /> Percentages are the space’s or padding’s…Read more

HTML: Use of Tables

“HTML tables” is one of the most important features of the HTML. You can use HTML tables to present tabular data on a web page. You can also use tables for page layout. Tables allow data to be arranged into rows and columns of data cells. You can put just about anything in a table’s cells, including images, paragraphs and even other tables. This flexibility makes tables useful for page layout and presenting tabular data. In this and some subsequent articles you will learn more about tables and how to use them properly…Read more

HTML: Image Maps

Image maps are one of the most interesting ways of using an image in your HTML web page. This article assumes that you have gone through all the previous articles regarding the use of images in your HTML web page. If not, it is highly suggested that you should go through them in order to understand better the use of images and different techniques to make it efficient and effective. In this article the creation and different uses of image maps in your web site is discussed. So what is an image map?…Read more

HTML : Adding Link to Images

A common practice on web is using images for hyperlinks. It is easy. Instead of wrapping text in <a></a> tags, wrap the <img/> tag in them. There is one slight problem; internet explorer and Firefox place a blue border around the image. This makes sense, the image is a hyperlink – your browser wants to notify the reader of this fact. But most of the times, the border appears aesthetically out of the place. Removing the border is really simple. If you are happy to use any deprecated tags, then you are free…Read more