| This article can be viewed as the previous article about creating XHTML web pages.Content as the coreThe separation of the interface and layout can also be used as a demonstration of the odd and clever techniques. P.s: If you want to work with it, install the Firefox (FF) browser first, because IE does not fully support CSS standards. XML document, we use the RSS format, so that everyone is familiar with it. You can find an RSS file to do this exercise at Will :) First, add
| <? XML-stylesheet type = "text/CSS" href = "style.css"?> |
As shown in:
Images related to this topic
The following figure shows the effect in FF:
Images related to this topic
It's very messy. Well, let's write down a CSS to differentiate them:
Effect:
Images related to this topic
Now, at the position of faridea RSS, we want to change it to our logo and write down the following CSS:
Channel> title: Before {
Content: URL ("images/logo.gif ");
} |
Images related to this topic
You must be beginning to get rid of the unnecessary faridea RSS behind the logo? Change his color to the same color as the background :). Sorry to use this clever trick. Now, add the background color to the design drawing and set the font to none of the information you don't want to display. Add the code similar to the following and rest assured that all the code will be included in the attachment.
Channel {
Background-color: # d9c4a6;
Font-size: 9pt;
}
Channel> title {
Color: white;
Width: 777px;
Margin-left: auto; margin-Right: auto;
/* Background-color: White ;*/
Background: # ffffff URL (images/top_bg.gif) top no-Repeat;
Padding: 20px 0px 0px 0px;
}
Channel> generator {
Display: none;
} |
Final Effect
Images related to this topic
Well, in the end, the website must be designed or createdContent as the core. It doesn't matter whether the content is surrounded by HTML tags, XHTML, or XML. The key is to properly organize them and then pick up the powerful CSS weapon to beautify her :) End Download all code:
This topic-Related File 155247.zip
|
