CSS

What is CSS?

Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language such as HTML, XML, XHTML ect . Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML(markup) document, including …

What is CSS? Read More »

Difference between CSS and HTML

HTML is used to structure content. CSS is used for formatting structured content.   Okay, it sounds a bit technical and confusing. But please continue reading. It will all make sense to you soon.   Back in the good old days Tim Berners Lee invented the World Wide Web (WWW), the language HTML was only …

Difference between CSS and HTML Read More »

What are the Basic CSS Syntax?

The basic CSS syntax is made up of following 3 parts: selector {property: value} The selector is typically an HTML tag or element such as <p>, <table>, <h1>,<div> etc . The following is a CSS code example of an internal style sheet. The selector (the <p> tag in this example) is made bold. Many of …

What are the Basic CSS Syntax? Read More »

What is CSS Comments?

We can insert comments in our CSS much like we can with HTML code. And just as in HTML, the comment will be ignored by the web browser. A CSS comment begins with “/*”, and ends with “*/”, like the following example. /* This is a CSS comment */ p { font-size: 120%; /* This …

What is CSS Comments? Read More »

Background Colors And Images In CSS

The background color property allows you to set the background color of an HTML element. The following CSS code example shows how to set the background property of a paragraph in aninternal style sheet. <html> <head> <style type=”text/css”> p { background-color: cyan } </style> </head> <body> <p> This paragraph will have a cyan background </p> …

Background Colors And Images In CSS Read More »

What is Cascading In CSS?

Cascading is like a waterfall. You start at the top. As you go down, there are different levels. There are 3 “levels” of CSS commands: On the same page within an HTML tag as a property. On the same page in the <HEAD> … </HEAD> area. On a separate page. Choosing the one or combination …

What is Cascading In CSS? Read More »

What is CSS Text in CSS?

Key issue for any web designers are: formatting and adding style to text . Now you will be introduced to the amazing opportunities CSS gives you to add layout to text. The following properties will be described in this section: text-indent text-align text-decoration letter-spacing text-transform Text indention [text-indent] The property text-indent allows you to add …

What is CSS Text in CSS? Read More »

CSS Font

CSS saves time and makes your life easier. One of the major advantages of using CSS to specify fonts is that at any given time, you can change font on an entire website in just a few minutes. Just change the master css and changes will be reflected in all linked pages instantly. We will …

CSS Font Read More »

CSS Links

With CSS you can add effects to hyperlinks. If you do not use CSS, the only alternative way to add effects to hyperlinks would be to use JavaScript. A hyperlink has four states that it can be in. CSS allows you to customize each state that it is in. It is also necessary to write …

CSS Links Read More »

CSS Padding

Padding can also be understood as “filling”. It’s like internal spacing. This makes sense as padding does not affect the distance of the element to other elements but only defines the inner distance between the border and the content of the element.   All the padding (left, right, bottom, left) can be combined using this …

CSS Padding Read More »

Margins

The CSS margin properties define the space around elements. It’s opposite to padding. Negative values can also be used to overlap content. A shorthand margin property can be used to change all of the margins at once. The top, right, bottom, and left margin can be changed independently using separate properties.   Note: Netscape and …

Margins Read More »

Line Spacing

CSS allows you to control the widthand height of an element, as well as increase the space between two lines, with the use of dimension properties.   The following CSS code example shows how to increase the space between lines.   <html> <head> <style type=”text/css”> p { line-height: 1cm; } p.bigSpace { line-height: 1.5cm; } …

Line Spacing Read More »

CSS Positioning

The CSS positioning properties allow you to specify the position of an element (element’s left, right, top, and bottom position). It also allows you to set the shape of an element, place an element behind another, and to specify what should happen when an element’s content is too big to fit in a specified area. …

CSS Positioning Read More »

CSS Layers

CSS allows you to position HTML elements on top of one another, giving control over which item will appear on top.CSS layers are more flexible and more convenient than other layout management schemas. Layers can be used for effective layout management. In the beginning, you may find it difficult , but as you get more …

CSS Layers Read More »

Border Color

The CSS border properties allow us to specify the style and color of an element’s border.With CSS we can create styled border. In HTML we use tables to create borders around a text, but with the CSS border properties we can create borders with nice effects, and it can be applied to any element.   …

Border Color Read More »

Border Width

The width of elements borders is defined by the property border-width, which can have the values thin,medium, and thick, or a numeric value, indicated in pixels. The border width of any object can be set with any width using the tag/argument border-width. border-width will not take effect with out border style. Border style can be …

Border Width Read More »

Border Style

There are different types of borders to choose from. Below are shown 8 different types of borders asInternet Explorer 5.5 and Firefox 2 interprets them. All examples are shown with the color “gold” and the thickness “thick” but can naturally be shown in other colors and thicknesses.   Note: Some border style make not show …

Border Style Read More »

Side Border

Each side of the border can be handled separately using the these tags.   Usage: border-top: <border-top-width> || <border-style> || <border-color> ; border-left: <border-left-width> || <border-style> || <border-color> ; border-bottom: <border-bottom-width>|| <border-style> || <border-color> ; border-right: <border-right-width> || <border-style> || <border-color> ;   Each side of the border can be handled separately using this tags. …

Side Border Read More »

Border

borders: Instead of setting each side of borders separately, the whole thing can be done using the single property ( the border property).   Usage: border: <border-width> || <border-style> || <border-color>;   This will set the border to any object.   border : 5px dotted green – The border is set using the tag border. …

Border Read More »

Top Margin

The CSS margin properties define the space around elements. CSS padding properties refer to the white space within the border or we can say that it’s internal spacing. Setting the value of a margin is NOT the same as setting the padding value, and you should always remember that padding & marginare two different properties. …

Top Margin Read More »

Scroll to Top