Browsed by
Category: complete css

HTML5 and CSS3 References

HTML5 and CSS3 References

The following section contains references to latest HTML5, CSS3 and more… HTML5 / XHTML Tags The following section contains a complete list of standard tags belonging to the HTML5 and XHTML 1.0 specifications. All the tags are ordered alphabetically. A <a> <abbr> <acronym> <address> <applet> <area> <article> <aside> <audio> B <b> <base> <basefont> <bdi> <bdo> <big> <blockquote> <body> <br> <button> C <canvas> <caption> <center> <cite> <code> <col> <colgroup> D <datalist> <dd> <del> <details> <dfn> <dir> <div> <dl> <dt> E <em> <embed> F…

Read More Read More

Efficient CSS with shorthand properties

Efficient CSS with shorthand properties

Efficient CSS with shorthand properties I get a lot of questions about CSS from people who aren’t crazy enough to have spent the thousands of hours working with CSS that I have. Sometimes I’m asked to take a look at something they’re working on to see if I can figure out why it doesn’t work as expected. When I look at their CSS I often find that it’s both bloated and unorganised. One of the reasons for using CSS to…

Read More Read More

Organize CSS Properties Alphabetically

Organize CSS Properties Alphabetically

Which example would you think is faster to find the margin-right property? Example 1 print? div#header h1 { z-index: 101; color: #000; position: relative; line-height: 24px; margin-right: 48px; border-bottom: 1px solid #dedede; font-size: 18px; } div#header h1 {z-index: 101;color: #000;position: relative;line-height: 24px;margin-right: 48px;border-bottom: 1px solid #dedede;font-size: 18px;} Example 2 print? div#header h1 { border-bottom: 1px solid #dedede; color: #000; font-size: 18px; line-height: 24px; margin-right: 48px; position: relative; z-index: 101; } div#header h1 {border-bottom: 1px solid #dedede;color: #000;font-size: 18px;line-height: 24px;margin-right: 48px;position:…

Read More Read More

Border-radius: create rounded corners with CSS!

Border-radius: create rounded corners with CSS!

W3C has offered some new options for borders in CSS3, of which one is border-radius. Both Mozila/Firefox and Safari 3 have implemented this function, which allows you to create round corners on box-items. One of the most talked about aspects of CSS3 is border-radius property. Rounder corners can be created independently using the four individual border-radius properties (border-bottom-left-radius, border-bottom-right-radius, border-top-left-radius, border-top-right-radius.) We can use border-radius shorthand property for all four corners simultaneously. It will take a single value for all…

Read More Read More

CSS Design Principles

CSS Design Principles

CSS design principles CSS3 as CSS2 and CSS1 before it, is based on a set of design principles: Forward and backward compatibility. CSS2 user agents will be able to understand CSS1 style sheets. CSS1 user agents will be able to read CSS2 style sheets and discard parts they don’t understand. Also, user agents with no CSS support will be able to display style-enhanced documents. Of course, the stylistic enhancements made possible by CSS will not be rendered, but all content…

Read More Read More

The Complete CSS Tags

The Complete CSS Tags

Text and Fonts font font-family font-size font-weight font-style font-variant line-height letter-spacing word-spacing text-align text-decoration text-indent text-transform vertical-align white-space Colours and Backgrounds color background-color background background-image background-repeat background-position background-attachment The Box Model – dimensions, padding, margin and borders padding, padding-top, padding-right, padding-bottom, padding-left border, border-top, border-right, border-bottom, border-left border-style, border-top-style, border-right-style, border-bottom-style, border-left-style border-color, border-top-color, border-right-color, border-bottom-color, border-left-color border-width, border-top-width, border-right-width, border-bottom-width, border-left-width outline outline-style outline-color outline-width margin, margin-top, margin-right, margin-bottom, margin-left width height min-width max-width min-height max-height Positioning and Display…

Read More Read More