<html5+css3+js>判断和循环

来源：互联网发布：给淘宝差评怎么写编辑：程序博客网时间：2024/06/03 04:19

（《javascript&jquery交互式web前端开发》学习记录）

完成效果

html5代码：

<!doctype html><html><head><meta charset="UTF-8"><title>May Studio</title><link rel="stylesheet" href="add.css" /></head><body>    <h1>Bullseye</h1>       <img src="teacher.png" id="teacher" alt="" />       <section id="blackboard"></section>   <script src="add.js"></script></body></html>

css3代码：

@charset "UTF-8";/* CSS Document */body{font:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;background:#F7D55E;color:#FFFFFF;font-size:150%;}h1{background:url(logo.png) no-repeat;text-indent:100%;/*文本块中首行缩进*/white-space:nowrap;/*规定段落中的文本不进行换行*/overflow:hidden;/*内容溢出元素框时隐藏，visible呈现在元素框外，scroll被修剪，浏览器显示滚动条以便查看剩余内容*/height:109px;width:643px;margin:40px auto;/*控制外边距，可用于控制元素居中*/}#teacher{float:right;margin:135px 30px 0 0;}#blackboard{width:600px;height:400px;background-color:#226A03;border:20px solid #936901;border-radius:20px;margin:auto;padding:40px;text-align:center;}

js代码：

// JavaScript Documentvar table=3;var operator='addition';var i=1;var msg='';if(operator==='addition'){while(i<11){msg+=i+'+'+table+'='+(i+table)+'<br />';i++;}} else{while(i<11){msg+=i+'*'+table+'='+(i*table)+'<br />';}}var el=document.getElementById('blackboard');el.innerHTML=msg;

代码下载：http://download.csdn.net/detail/qq_17615475/9343745

0 0