The next image, tickets.jpg, is not shown either in the book or in the list of code examples. I shall use star.jpg instead.Steve Souders, a web performance expert, discusses the use of @import.
The basics of @import is recommended with the site:
'http://reference.sitepoint.com/css/', but it returns the site which one gets by clicking on '@import'.
This site invites you to 'Start a 7-day FREE Membership' to get access to 170+ books from the world's best tech publishers. After that, you pay $9/month. The first time it popped up it offered a free JavaScript book worth over $11.00 at Amazon.
Previous versions of HTML asked to include '"type =text/css"' in the link elements, but HTML5 doesn't require it.
ECLoc6170 gives the following example:
The next image, tickets.jpg, is not shown either in the book or in the list of code examples. I shall use star.jpg instead.
She writes: 'I love the Palau del Música'.
Note that I used 'style = "float: left;"' in the img tag.
I had a lot of trouble with placing the above note to the right of the star picture. The margin-left specification starts at the edge of page, not at the edge of right side of the dotted border. (I could not produce the above note with the use of padding.)
Furthermore, I also had to specify the width to avoid having the background color extend all the way to the right edge. The correct value for the width was obtained by trial-and-error.
A style marked with !important always wins, whether it’s first in the order, last, or somewhere in between. Here’s an example: p { margin-top: 1em !important; }
I advise not using @import, for performance reasons. But if it is used, imported styles will lose out to any conflicting styles that appear later than them, as you would expect.
You can designate a style sheet to be used only for a particular output, such as only for printing or only for viewing onscreen in a browser.
Add media = "output" to the link or style element start tags, where output is one or more of the following: print, screen, or all (these are the most common types, though others exist; see the tips)
Note that EC does not use type = "text/css" in the '<link rel' line, as shown below.
<link rel = "stylesheet" href = "Styles/st04.css" media = "screen" />
<link rel = "stylesheet" href = "Styles/st04.css" media = "print" />
There are nine possible output types: all, aural, braille, handheld, print, projection, screen, tty, and tv. They have varying degrees of browser support.
I stopped here: ECLoc6313, P203