Archive for: July, 2014

CSS combinators

Descendant combinator Descendant combinator is used to select the elements which are descendant of another element. Syntax: selector1 whitespace selector2 HTML snippet: <div id=”mystyle1″> <p>sdfsdsdfdsf</p> <div> This is a sample text placed as a placeholder. This is a sample text placed as a placeholder.   <p>Hello world! Welcome to this tutorial page!</p>   This is…

Read More →

CSS selectors

So far, in past chapters we have applied styles to body and div like below: <div> div{ width : 200px; } Here, div -> selector width -> property-name 200px -> property-value   CSS rule syntax So the basic syntax for applying CSS rule is selector{ property-name : property-value; }   Selectors Now, let us see…

Read More →

CSS Border

Used to draw a border around an element. border-width This property specifies the width of the border.   Applicable values: thin, medium, thick Or else the values should be specified in pixels e.g., 2px   border-style This property specifies the line style of the border   Applicable values: none – no border hidden – Same…

Read More →

CSS Visual Formatting

width This property specifies the content width of the elements.   HTML snippet <div> Hello world! Welcome to this tutorial page! </div> CSS snippet div{ background-color: #e1e1e1;  /*light gray color*/ width : 200px; } Output: The width of the <div> element is reduced to 200px; *Try removing the width property and test the difference.  …

Read More →

CSS backgrounds

background-color This property is used to set the background color of an element. CSS snippet: body{ background-color: #e1e1e1;  /*light gray color*/ } Output: The background color of the page changes into light gray color.   background-image This property is used to set an image as the background for an element. CSS snippet: body{ background-image: url(“sample-image.jpg”);…

Read More →

CSS Online Practise

How to test the CSS in this tutorial? CSSDesk online CSS Sandbox http://cssdesk.com/ Click here to open the CSSDesk sandbox in new tab. Copy the HTML snippet in the tutorial and paste it in the HTML dialog box on top-left textarea of the page. Copy the CSS snippet in the tutorial and paste it in…

Read More →

CSS Introduction

Cascade Style Sheets (CSS) is a simple mechanism for adding styles to your web pages. Practical Applications: Consider you have developed a website with around 1000s of web pages. All the web pages background color is white now. In future, if you wanna change the background color of all the pages to light gray color…

Read More →

HTML Forms

HTML Forms allows us to get data from the user level. A simple example is any application form you are filling online such as passport etc. We can get different kinds of input from user such as text inputs, passwords, radio buttons, check box, submit button, drop down list etc. We can create forms by…

Read More →

HTML Tables

HTML allows us to define tables inside the document by using <table>tag. A table is divided into many rows with the <tr> tag where <tr> stands for table row which specifies the content of the data cell. It may contain other tables, text, list, images etc. Each row can be sub divided into data cells…

Read More →

HTML Images

HTML allows us to display an image on a page (not as background).   If you want to display an image on a page, you need to use the imgsrc attribute i.e. image source.   Src contains the value of the URL of the image that you want to display on the page.   NOTE:…

Read More →

Back to Top