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…
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…
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…
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. …
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”);…
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…
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…
© Copyright 2014 by Programmingtute. All Rights Reserved.