Div + CSS Adaptive Background Color

Source: Internet
Author: User
<! Doctype HTML public "-// W3C // dtd html 4.01 transitional // en" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<! -- Saved from url = (0052) http://www.forest53.com/tutorials/test/3columns.html -->
<HTML lang = en XML: lang = "en" xmlns = "http://www.w3.org/1999/xhtml"> <Meta http-equiv = Content-Type content = "text/html; charset = gb2312">
<SCRIPT type = text/JavaScript>
/*
------------------------------------------------
Pvii equal CSS columns scripts
Copyright (c) 2005 project seven Development
Www.projectseven.com
Version: 1.5.0
------------------------------------------------
*/
Function p7_colh () {// v1.5 by PVII-www.projectseven.com
VaR I, oh, HH, H = 0, da = Document. p7eqc, An = Document. p7eqa; If (DA & Da. Length ){
For (I = 0; I <da. length; I ++) {da [I]. style. height = 'auto';} for (I = 0; I <da. length; I ++ ){
Oh = da [I]. offsetheight; H = (OH> H )? Oh: H ;}for (I = 0; I <da. length; I ++) {If (){
DA [I]. style. height = H + 'px ';} else {p7_eqa (DA [I]. ID, DA [I]. offsetheight, h) ;}} if (){
For (I = 0; I <da. length; I ++) {HH = da [I]. offsetheight; If (HH> H ){
DA [I]. style. Height = (H-(hh-h) + 'px' ;}} else {document. p7eqa = 1 ;}
Document. p7eqth = Document. Body. offsetheight;
Document. p7eqtw = Document. Body. offsetwidth ;}
}
Function p7_eqt () {// v1.5 by PVII-www.projectseven.com
If (document. p7eqth! = Document. Body. offsetheight | document. p7eqtw! = Document. Body. offsetwidth ){
P7_colh ();}
}
Function p7_1_cols () {// v1.5 by PVII-www.projectseven.com
If (document. getelementbyid) {document. p7eqc = new array; for (I = 0; I <arguments. length; I ++ ){
Document. p7eqc [I] = Document. getelementbyid (arguments [I]);} setinterval ("p7_eqt ()", 10 );}
}
Function p7_eqa (El, H, HT) {// v1.5 by PVII-www.projectseven.com
VaR sp = 10, Inc = 10, nH = H, G = Document. getelementbyid (EL), oh = G. offsetheight, CH = parseint (G. style. Height );
Ch = (CH )? Ch: H; var ad = OH-Ch, ADT = HT-ad; NH + = Inc; nH = (NH> ADT )? ADT: NH; G. style. Height = NH + 'px ';
Oh = G. offsetheight; If (OH> HT) {nH = (HT-(OH-HT); G. style. Height = NH + 'px ';}
If (NH <ADT) {setTimeout ("p7_eqa ('" + EL + "'," + NH + "," + HT + ")", SP );}
}
</SCRIPT>

<Style type = text/CSS> body {
Padding-Right: 0px; padding-left: 0px; font-size: 75%; padding-bottom: 0px; margin: 5px; line-Height: 100%; padding-top: 0px; font-family: verdana, Geneva, Arial, Helvetica, sans-serif
}
# Header {
Padding-Right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px auto; width: 760px; padding-top: 0px
}
# Mid {
Padding-Right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px auto; width: 760px; padding-top: 0px
}
# Footer {
Padding-Right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px auto; width: 760px; padding-top: 0px
}
# Header {
Background: # f4f4f4; margin-bottom: 5px; Height: 60px
}
H3 {
Margin: 0px; color: #708090; padding-top: 25px; text-align: Center
}
H5 {
Margin: 0px; color: #708090; padding-top: 25px; text-align: Center
}
# Fbox {
Background: # f1f1f1; float: Left; width: 195px
}
# Mbox {
Padding-Right: 0px; padding-left: 0px; Background: # dff7ff; float: Left; padding-bottom: 0px; margin: 0px 5px; width: 360px; padding-top: 0px
}
# Sbox {
Background: # ffebcc; float: Right; width: 195px
}
P {
Padding-Right: 10px, padding-left: 10px, padding-bottom: 10px, margin: 0px, text-indent: 2em, line-Height: 130%, padding-top: 10px
}
# Footer {
Clear: Both; border-top: # ffffff 5px solid; Background: # cddbed; Height: 60px; text-align: Center
}
</Style>

<Meta content = "mshtml 6.00.2900.2873" name = generator> <Body onload = "p7_1_cols ('fbox', 'mbox', 'sbox')">
<Div id = header>
<H3> the script controls the Three-row and three-column adaptive height Div layout <Div id = mid>
<Div id = fbox>
<P> affinity is not just about blind people and screen readers. Many people, although not blind, have visual impairment-
You and I will become one of them as they grow older. One of the simplest ways to make a website more friendly is to allow users to change the text size. rejecting such a choice will deprive users of their dominance, which may make Users unable to read it comfortably.
</P>
<P> affinity is not just about blind people and screen readers. Many people, although not blind, have visual impairment-
You and I will become one of them as they grow older. One of the simplest ways to make a website more friendly is to allow users to change the text size. rejecting such a choice will deprive users of their dominance, which may make Users unable to read it comfortably.
</P> </div>
<Div id = mbox>
<P> affinity is not just about blind people and screen readers. Many people, although not blind, have visual impairment-
You and I will become one of them as they grow older. One of the simplest ways to make a website more friendly is to allow users to change the text size. rejecting such a choice will deprive users of their dominance, which may make Users unable to read it comfortably.
</P>
<P> If the designer uses pixels to specify the text size, most users cannot scale the text because Internet Explorer
The method for changing the text size is different from that of other browsers. Mozilla and opera can scale the text that has been set to pixel size, but Windows ie cannot. </P>
<P> affinity is not just about blind people and screen readers. Many people, although not blind, have visual impairment-
You and I will become one of them as they grow older. One of the simplest ways to make a website more friendly is to allow users to change the text size. rejecting such a choice will deprive users of their dominance, which may make Users unable to read it comfortably.
</P>
<P> If the designer uses pixels to specify the text size, most users cannot scale the text because Internet Explorer
The method for changing the text size is different from that of other browsers. Mozilla and opera can scale the text that has been set to pixel size, but Windows ie cannot. </P> </div>
<Div id = sbox>
<P> affinity is not just about blind people and screen readers. Many people, although not blind, have visual impairment-
You and I will become one of them as they grow older. One of the simplest ways to make a website more friendly is to allow users to change the text size. rejecting such a choice will deprive users of their dominance, which may make Users unable to read it comfortably.
</P> </div>
<Div id = footer>
<H5> welcome to: <a href = "http://www.yzci.com/"> yzci. com </a> </H5>
</Div> </body>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.