合理使用HTML标签进行CSS布局

来源:网络 作者:佚名 阅读: 字体:[ ] [打印] [关闭]
自定义标签 wzsp 未创建

内容提要:CSS高级布局已逐渐流行,但面对所谓DIV+CSS布局的叫法让人更为担心,不要让DIV成为Table的替代品,多层嵌套的DIV会严重影响代码的可阅读性,活用HTML为我们提供的标签吧。 什么时候应该用DIV? 虽然在这方面没有什么硬 ……

看到上面的效果,你也许以为这是一张带文字的图片而已;呵呵,用你的鼠标去选取文字看看,发现了吧,这完完全全是一张图片和文字的组合,下面我就来介绍它是怎么做的。

  先看看代码:

  

以下是引用片段:
<div id="info">
<h2>TRACKING YOUR IMAGES</h2>
<div id="holdit">
<img src="http://edu.admin5.com/imagelist/06/24/4fnpgj5042e6.jpg" alt="Winnie the pooh" title="Winnie the pooh" />
<em class="a420"></em>
<em class="a430"></em>
<em class="a400"></em>
<em class="a370"></em>
<em class="a340"></em>
<em class="a300"></em>
<em class="a270"></em>
<em class="a250"></em>
<em class="a240"></em>
<em class="a230"></em>
<em class="a230"></em>
<em class="a340"></em>
<em class="a340"></em>
<em class="a360"></em>
<em class="a540"></em>
<em class="a540"></em>
<em class="a540"></em>
<em class="a550"></em>
<em class="a550"></em>
<em class="a550"></em>
<em class="a550"></em>
<em class="a550"></em>
<em class="a550"></em>
<em class="a540"></em>
<em class="a460"></em>
<em class="a490"></em>
<em class="a500"></em>
<em class="a500"></em>
<p>"I shall have to wait until I catch up with it," said Winnie-the-Pooh. "Now, look there." He pointed to the ground in front of him. "What do you see there?"<br />
"Tracks," said Piglet. "Paw-marks." He gave a little squeak of excitement. "Oh, Pooh! Do you think it''s a--a--a Woozle?"<br />
"It may be," said Pooh. "Sometimes it is, and sometimes it isn''t. You never can tell with paw- marks."<br />
With these few words he went on tracking, and Piglet, after watching him for a minute or two, ran after him. Winnie-the-Pooh had come to a sudden stop, and was bending over the tracks in a puzzled sort of way.<br />
"What''s the matter?" asked Piglet.<br />
"It''s a very funny thing," said Bear, "but there seem to be two animals now. This--whatever-it-was--has been joined by another--whatever-it-is--
and the two of them are now proceeding in company. Would you mind coming with me, Piglet, in case they turn out to be Hostile Animals?"<br />
Piglet scratched his ear in a nice sort of way, and said that he had nothing to do until Friday, and would be delighted to come, in case it really was a Woozle.<br />
"You mean, in case it really is two Woozles," said Winnie-the-Pooh, and Piglet said that anyhow he had nothing to do until Friday. So off they went together.</p>
</div>
</div>

 

1234下一页
[标签: 合理使用HTML标签进行CSS布局, ] [打印] [关闭]
站长评论(0) 查看所有评论
相关新闻

热门新闻

推荐新闻