Blow, Blow, Thou Winter Wind
William Shakespeare
Blow, blow, thou winter wind,
Thou art not so unkind
As man's ingratitude;
Thy tooth is not so keen
How Do I Love Thee?
Elizabeth Barrett Browning
How do I love thee? Let me count the ways.
I love thee to the depth and breadth and height
My soul can reach, when feeling out of sight
For the ends of Being and ideal Grace.
Seven Ages Of Man
William Shakespeare
All the world's a stage,
And all the men and women merely players,
They have their exits and entrances,
And one man in his time plays many parts,
网页刚加载时只显示部分内容,点击More按钮后显示全部内容,CSS控制,兼容各种浏览器
第一步:
在网页<head>区添加样式定义
<style type="text/css">
/* ================================================================
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/drop_variations.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any
way to fit your requirements.
由站酷(zcool)http://www.zcool.com.cn/ 整理
来源于:http://www.cssplay.co.uk
=================================================================== */
/* common styling */
/* Set up the default font and ovrall size to include image */
body {
background: #fff;
font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
font-size: 11px;
}
.holder {width:210px; margin:5px; padding:5px; border:1px solid #ddd; float:left; background:#f8f8f8;}
.holder h2 {text-align:left;}
a.hid {color:#000; text-decoration:none; outline-style:none; position:relative; z-index:500;}
a.hid em {display:none;}
a.hid:hover {text-decoration:none;}
a.hid:active, a.hid:focus {background:#fff;}
a.hid:active span, a.hid:focus span {display:none;}
a.hid:active em, a.hid:focus em {display:block; background:#f8f8f8; color:#000; width:210px; font-style:normal; cursor:default; padding:5px 5px 20px 5px; position:absolute; left:-6px; top:-5px; border:1px solid #ddd; border-width:0 1px 1px 1px;}
.clear {clear:both;}
</style>
第二步:
在网页<body>区添加HTML显示代码
<div class="holder"> <h2>Blow, Blow, Thou Winter Wind</h2> <p class="bold">William Shakespeare</p> <p>Blow, blow, thou winter wind,<br /> Thou art not so unkind<br /> As man's ingratitude;<br /> Thy tooth is not so keen</p> <p><a class="hid" href="#more" onclick="this.hideFocus=true" onblur="this.hideFocus=false"><span>more »</span> <em>Because thou art not seen,<br /> Although thy breath be rude.<br /> Heigh-ho! sing heigh-ho! unto the green holly:<br /> Most friendship is feigning, most loving mere folly:<br /> Then, heigh-ho! the holly!<br /> This life is most jolly.<br /> <br /> Freeze, freeze, thou bitter sky,<br /> Thou dost not bite so nigh<br /> As benefits forgot:<br /> Though thou the waters warp,<br /> Thy sting is not so sharp<br /> As friend remember'd not.<br /> Heigh-ho! sing heigh-ho! unto the green holly:<br /> Most friendship is feigning, most loving mere folly:<br /> Then, heigh-ho! the holly!<br /> This life is most jolly.<br /></em></a></p> </div> <div class="holder"> <h2>How Do I Love Thee?</h2> <p class="bold">Elizabeth Barrett Browning</p> <p>How do I love thee? Let me count the ways.<br /> I love thee to the depth and breadth and height<br /> My soul can reach, when feeling out of sight<br /> For the ends of Being and ideal Grace.</p> <p><a class="hid" href="#more" onclick="this.hideFocus=true" onblur="this.hideFocus=false"><span>more »</span> <em>I love thee to the level of every day's<br /> Most quiet need, by sun and candlelight.<br /> I love thee freely, as men strive for Right;<br /> I love thee purely, as they turn from Praise.<br /> I love with a passion put to use<br /> In my old griefs, and with my childhood's faith.<br /> I love thee with a love I seemed to lose<br /> With my lost saints, I love thee with the breath,<br /> Smiles, tears, of all my life! and, if God choose,<br /> I shall but love thee better after death.<br /></em></a></p> </div> <div class="holder"> <h2>Seven Ages Of Man</h2> <p class="bold">William Shakespeare</p> <p>All the world's a stage,<br /> And all the men and women merely players,<br /> They have their exits and entrances,<br /> And one man in his time plays many parts,</p> <p><a class="hid" href="#more" onclick="this.hideFocus=true" onblur="this.hideFocus=false"><span>more »</span> <em>His acts being seven ages. At first the infant,<br /> Mewling and puking in the nurse's arms.<br /> Then, the whining schoolboy with his satchel<br /> And shining morning face, creeping like snail<br /> Unwillingly to school. And then the lover,<br /> Sighing like furnace, with a woeful ballad<br /> Made to his mistress' eyebrow. Then a soldier,<br /> Full of strange oaths, and bearded like the pard,<br /> Jealous in honour, sudden, and quick in quarrel,<br /> Seeking the bubble reputation<br /> Even in the cannon's mouth. And then the justice<br /> In fair round belly, with good capon lin'd,<br /> With eyes severe, and beard of formal cut,<br /> Full of wise saws, and modern instances,<br /> And so he plays his part.<br /> The sixth age shifts<br /> and mere oblivion,<br /> Sans teeth, sans eyes, sans taste, sans everything.<br /></em></a></p> </div> <br class="clear" />




