Friends need: To html+css the pages of the book to achieve the layout effect (see figure)
HTML code:
1: <!--my blog: http://www.ido321.com- -
HTML >
HTML>
Head>
http-equiv = "Content-type" content = "Text/html;charset=utf-8" >
Title>Test</title>
name = "Author" content = "Forgotten ~ Shallow Thinking" >
rel = "stylesheet" type = "Text/css" href = "Shuben.css" >
Head>
Body>
class = "Content" >
class = "text" >
href = "Http://www.ido321.com" Target = "_blank" >www.ido321.com</a>program Enthusiasts QQ Group: 259280570, if you are coder, you are welcome to join us. If you are coder, you are welcome to join us.
P>
class = "Code" >
style = "margin-left:-250px" >
: padding-left:2em;
: }
Pre>
div>
class = "text" >
a href = "http://www.ido321.com" Span style= "color: #ff0000;" >target = "_blank" > Www.ido321.com</ > . Program Enthusiasts QQ Group: 259280570, if you are coder, welcome to join us. If you are coder, you are welcome to join us. My blog: < a href = "http://www.ido321.com" target = "_blank" > www.ido321.coma > . Program Enthusiasts QQ Group: 259280570, if you are coder, you are welcome to join us. If you are coder, you are welcome to join us.
P>
class = "Imgdiv" >
class = "Left" >
src = "1.jpg" >
P> figure 1:xxxxxx</p>
div>
class = "Right" >
src = "1.jpg" >
P> figure 2:xxxxxx</p>
div>
div>
div> </ Div >
class = "BTN" >
Button>10.11 Set word spacing </button>
div>
class = "text" >
href = "Http://www.ido321.com" Target = "_blank" >www.ido321.com</a>program Enthusiasts QQ Group: 259280570, if you are coder, you are welcome to join us. If you are coder, you are welcome to join us.
P>
class = "text" >
href = "Http://www.ido321.com" Target = "_blank" >www.ido321.com</a>program Enthusiasts QQ Group: 259280570, if you are coder, you are welcome to join us. If you are coder, you are welcome to join us.
P>
class = "Footer" >
class = "Code2" >
style = "Background-color: #ccc;" >
style = "Margin-left:1.5em" >
BR/>
£ º text-indent:-2em; <br/>
Wu : </p>
div>
class = "text" >
href = "Http://www.ido321.com" Target = "_blank" >www.ido321.com</a>program Enthusiasts QQ Group: 259280570, if you are coder, you are welcome to join us. If you are coder, you are welcome to join us.
P>
div>
class = "FooterRight" >
src = "1.jpg" >
P> figure 3:xxxxxx</p>
div>
div>
div>
Body>
HTML>
CSS code:
1: *{
3: padding: 0;
5:. Content{
7: height1000px;
9:. Text{
One : text-indent2em;
: }
: colorred;
: }
: text-decorationnone;
:. Code{
: width100%;
:. Imgdiv{
: margin-top1em;
: }
: floatleft;
:.Right {
: margin-left1.5em;
Panax Notoginseng: }
A : clearboth;
: -5px 5px #888888;
: -5px 5px #888888;
: }
: text-alignleft;
$: font-weightbold;
Wuyi: }
: margin-top1.5em;
:. Code2{
£ º floatleft;
:. FooterRight{
: margin-left1.5em;
Final effect in FF: (partial)
Deficiencies, please correct me.
Source: http://www.ido321.com/532.html
A book page about a friend of friends implementation of simple layout (HTML+CSS)