完善clearfix、表单、框架集
完善clearfix
content:' '
display:table作为属性进行设置
父子元素可以合并编写
例如:
clearfix:before;
clearfix:after;
display:table;
clear:both;
表单
提交给服务器
form标签
<form action='后台地址'>添加表单项</form>
用input制作一个文本框
<input type="">
<input type="sumbit"> 默认提交
<input type="sumbit" value=' '>
placeholder提示信息
password
单选框(例子)
性别<input type="radio">男
<input type="radio">女
<input type="radio” name='gender'>不男不女
多选框(例子)
爱好<input type=""checkbox' name="hobby"value=' basketball'>篮球
<input type=""checkbox' name="hobby"value='girl '>
<input type=""checkbox' name="hobby"value=' song'>
<input type=""checkbox' name="hobby"value='dance '>
你喜欢的明星
<select>
<option value=''></option></select>
默认设置:checked
默认为selected
multiple=“multiple”多选
optgroup分组 label属性
<textarea name='info'>可以写多行的文本
reset 重置
button 按钮 无任何功能
<fieldset></fieldset>给分组
legend设计分类名称
框架集
框架集能带入多个
内联框架只能带入一个
frameset和body不能出现同一个框架
frame 属性rows 上下分为两部分 cols 左右两部分
ie6png
想页面引入JS
<script type='text/javascript' src='js/DD_belatedPNG_0.0.8a-min.js'></script>
<script type='text/javascript'>js/DD_belatedPNG.fix("div,img");</script>
CSS过度动画
transition: width 500ms(动画运动的时间) ease,height 500ms ease 500ms,background-color 500ms ease 1s,border-radius 500ms ease 1.5s;
border-radius:50px;圆角的图片
transition:all 500ms ease
运动曲线
div;nth-child(1){
transition:all 1s linear 匀速
}
div;nth-child(2){
transition:all 1s ease 开始和结束慢速
}
div;nth-child(3){
transition:all 1s ease-in 开始是慢速
}
div;nth-child(4){
transition:all 1s ease-out 结束时慢速
}div;nth-child(5){
transition:all 1s ease-in-out 开始和结束时慢速
}div;nth-child(6){
transition:all 1s cubic-bezier(n,n,n,n);
}
反冲回弹的效果