您的位置:首页 > Web前端 > CSS

Head First HTML with CSS & XHTML笔记

2007-02-28 00:06 567 查看
Element = Opening Tag + Content + Closing Tag

Q:I've noticed the HTML in some pages doesn't always match opening tags with closing tags.
A:Well, the tags are supposed to match. In general, browsers do a pretty good job of figuring out what you mean if you write incorrect HTML. But, as you're going to see, these days there are big benefits to writing totally correct HTML. If you're worried you'll never be able to write perfect HTML, don't be; there are plenty of tools to verify your code before you put it on a Web server so the whole world can see it. For now, just get in the habit of always matching your opening tags with closing tags.
Q:Well, what about that <img src="drinks.gif"> tag in the lounge example? Did you forget the closing tag?
A:Wow, sharp eye. There are some elements that use a shorthand notation with only one tag.
Attributes give you a way to provide additional information about an element. Like, if you have a style element, the attribute allows you to say exactly what kind of style you're talking about.
<style type="text/css">
Because you're going to use CSS, you need to specify the "text/css" type.(暂时没有别的选择)
There aren't currently any other styles that work with today's browsers, but those designers of HTML are always planning ahead and anticipate that there may be other types of style in the future.
</style>

 Linking down into a subfolder
 Linking up into a "parent " folder     ../

Q:My operating system uses "/" as a separator; shouldn't I be using that instead of "/"?
A:No; in Web pages you always use "/". Don't use "/".
The rough design sketch→From a sketch to an outline→From the outline to a Web page

 the <q > element
 Some browsers, including Internet Explorer version 6, do not display double quotes around the content in the <q> element. This is unfortunate, because if you add your own double quotes, some browsers will display TWO sets of quotes. The only way to solve this conundrum is to use CSS to add some visual style to your quotes 
 <blockquote> creates a separate block (like <p> does), plus it indents the text a bit to make it look more like a quote.

<blockquote> and <q> are actually different types of elements. The <blockquote> element is a block element and the <q> element is an inline element. What's the difference? Block elements are always displayed as if they have a linebreak before and after them, while inline elements appear "in line" within the flow of the text in your page.
 Block: stands on its own
 Inline: goes with the flow
 <h1>, <h2>, ..., <h6>, <p>, and <blockquote> are all block elements.
<q>, <a>, and <em> are inline elements.

make a list...
 Step One:Put each list item in an <li > element. 
 Step Two:Enclose your list items with either the <ol > or <ul> element.

you wanted to type "The <html> element rocks." in your page. Using the character entities, you'd type this instead:         The <html> element rocks.

BULLET POINTS

Plan the structure of your Web pages before you start typing in the content. Start with a sketch, then create an outline, and finally write the HTML.

Plan your page starting with the large, block elements, and then refine with inline elements.

Remember, whenever possible, use elements to tell the browser what your content means.

Always use the element that most closely matches the meaning of your content. For example, never use a paragraph when you need a list.

<br> is an "empty element." Empty elements have no content. An empty element consists of only one tag.

You make an HTML list using two elements in combination: use <ol> with <li> for an ordered list; use <ul> with <li> for an unordered list. When the browser displays an ordered list, it creates the numbers for the list so you don't have to.

You can specify your own ordering in an ordered list with the start attribute. To change the values of the individual items, use the value attribute.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息