Home > Developer > Web Develop
<! DOCTYPE HTML >
<title></title>
<script type= "Text/javascript" src= "Js/jquery-1.11.3.js" ></script>
<script type= "Text/javascript" >
$ (document). Ready (function () {
$ ("#fontsize"). Change (
function ()
{
$ ("P"). css ({fontSize:this.value});//dom
}
)
Change the font color
$ ("#backgroundcolor"). Change (
function ()
{
$ ("P"). css ({background:this.value});
}
)
Change the background color
$ ("#fontcolor"). Change (
function ()
{
$ ("P"). css ({color:this.value});
}
)
});
</script>
<body>
<div id= "Formstylecontrols" >
<label for= "fontsize" > Font size </label>
<select id= "FontSize" >
<option value= "12px" > S </option>
<option value= "14px" > smaller </option>
<option value= "16px" > Medium </option>
<option value= "18px" > Larger </option>
<option value= "24px" > Large </option>
</select>
<label for= "Backgroundbackground" > Background color </label>
<select id= "BackgroundColor" >
<option value= "#F4FBFF" > Default </option>
<option value= "Gray" > Gray </option>
<option value= "Red" > Red </option>
<option value= "green" > Greens </option>
<option value= "Yellow" > Yellow </option>
</select>
<label for= "fontcolor" > Font color </label>
<select id= "FontColor" >
<option value= "#000000" > Black </option>
<option value= "#ff0000" > Red </option>
<option value= "#006600" > Green </option>
<option value= "#0000ff" > Blue </option>
<option value= "#660000" > Brown </option>
</select>
<label>
<input type= "Submit" id= "style" value= "Save Settings"/>
</label>
</div>
<p> early March Three, spring sunny </p>
<p> Mighty Wedding Team, turned over the main streets of Jinling City, and then the new Queen Feng Miaoji out of the limelight sent to the Emperor selected bridal chamber Soft Hall. Hershey minister, relatives and friends have been excused, soon, after the emperor will join hands into the bridal chamber, spend the night ......</p>
<p> at this moment, I stand in this piece of water Manshire between the big ranch, the foot is three pieces of ancient huge stone paved small square, the front of the pine and cypress lush is a cold nunnery, that is once spoiled my king gave me the final destination. </p>
</body>
</script>
JQUERY-CSS exercise; Change the size of the font in the P tag color background
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
