All Entries in the "CSS Basic" Category
CSS shorthand for font properties
The CSS properties discussed so far can be written in shorthand, enabling you to cut down on space and manage your CSS font settings with greater ease. Like some other shorthand properties, some rules apply:
1.Some browsers are more forgiving than others regarding required and optional values, but you should always specify the font-size and font-family [...]
Styling text using CSS
HTML is intended as a structural markup language, but the Web’s increasing popularity meant it got “polluted” with tags designed for presentation. This made HTML more complex than it needed to be, and such tags soon became a headache for web designers trying to style page elements, such as text. In the bad ol’ days [...]
Web design overview
Web design has evolved rapidly over the years. Initially, browsers were basic, and early versions
of HTML were fairly limited in what they enabled designers to do. Therefore, many older sites on the Web are plain in appearance. Additionally, the Web was originally largely a technical repository, hence the boring layouts of many sites in the [...]
Web page backgrounds in CSS
Backgrounds are added to web page elements using a number of properties, as described
in the sections that follow. background-color This property sets the background color of the element. In the following example, the page’s body background color has been set to #ffffff (which is hex for white):
body {
background-color: #ffffff;
}
background-image
This property sets a background image for [...]
Setting a default font and font color using CSS
As mentioned earlier, the body start tag was historically used to house attributes for dealing with default text and background colors, link colors, and background images. In CSS, link styles are dealt with separately. At this point, it’s worth noting that, when working with CSS, the body selector is often used to set a default font [...]
Working with CSS shorthand for boxes
This is something that is useful to get to grips with, in order to create the most efficient and easy-to-update CSS.
The previous example showed how to set all margins and padding values to 0, and this was done in shorthand instead of writing out every single value. How CSS shorthand works for boxes is like [...]
Content margins and padding in CSS
Page margins and padding are easy to define using CSS. By setting these values once in an external file, you can update settings site-wide by uploading an amended style sheet rather than every single page on your site that has an amended body tag.
Furthermore, in terms of page weight, CSS is more efficient. If using [...]
CSS comments looks
CSS comments look like this: /* this is a comment */, and can be single-line or multipleline. In the advanced CSS boilerplate, a multiline comment is used for an introduction and table of contents:
/*
STYLE SHEET FOR [WEB SITE]
Created by [AUTHOR NAME]
[URL OF AUTHOR]
ToC
1. defaults
2. structure
3. links and navigation
4. fonts
5. images
Notes
*/
Each section of the document is [...]