1.CSS box-sizing属性
div{ width:60px; padding:20px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }作用：width:60px,而不是100px
2.三种方式清除浮动。 【参考内容：http://www.divcss5.com/jiqiao/j406.shtml】 ①给父元素设置适合高度。
<!doctype html> <html> <head> <title></title> <meta charset='utf-8'> <link rel="stylesheet" type="text/css" href=""> <style type="text/css"> div.parent{ width:400px; border:solid 2px teal; background-color: orange; } div.parent .child1{ width: 180px; height: 100px; border:1px solid orange; float:left; background-color: #afb; } div.parent .child2{ width: 180px; height: 100px; border:1px solid orange; float:right; background-color: #afb; } </style> </head> <body> <div class="parent"> <div class="child1">left浮动</div> <div class="child2">right浮动</div> </div> </body> </html> //改进 div.parent{ height:102px; }②
③
3.
<!doctype html> <html> <head> <title></title> <meta charset='utf-8'> <link rel="stylesheet" type="text/css" href=""> <style type="text/css"> div{ display: box; display:-moz-box; display:-webkit-box; border:1px solid orange; width:600px; } #p1{ -webkit-box-flex:1.0; -moz-box-flex:1.0; box-flex:1.0; background-color: #afb; } #p2{ -webkit-box-flex:2.0; -moz-box-flex:2.0; box-flex:2.0; background-color: #8a9; } </style> </head> <body> <div> <p id='p1'>Hello</p> <p id='p2'>yyc</p> </div> <p><b>*</b>IE 不支持box-flex属性</p> </body> </html>4.CSS：使一个div元素在5秒内向右平移500px，并不断重复该过程。
<!doctype html> <html> <head> <title></title> <meta charset='utf-8'> <link rel="stylesheet" type="text/css" href=""> <style type="text/css"> div#yyc{ border: 2px solid orange; width: 100px; height: 50px; animation:mymove 5s infinite; -webkit-animation:mymove 5s infinite; } @keyframes mymove{ //关键帧 form{ transform:translateX(0); } to{ transform:translateX(500px); } } </style> </head> <body> <div id='yyc'>yyc</div> </body> </html>5.
//提取字符串中的数字 var string = "yyc1234.567yyc"; var string = "yyc1234.567yyc"; function getNum(string){ var value = string.replace(/[^0-9.]/ig,''); return value; } getNum(string);//"1234.567"6.
//作为对象的一个方法 var onePerson={ name:'yyc', age:21, person:function(){ return this.name; } }; onePerson.person();//"yyc"7.编写一个函数，实现：calculate(“11”, “111”) // => 10
function calculate(num1,num2){ var a = parseInt(num1,2);//第二个参数代表基数，即几进制 var b = parseInt(num2,2); return a+b; } calculate('11','111');//10