1、怎样让p占据整个页面高度而没有滑条?
给body设置属性overflow:hidden;
2、鼠标变小手?
cursor:pointer;
3、文本框提示信息(placeholder)修改样式?
兼容主流浏览器
input::-webkit-input-placeholder{
color:white;
}
input::-moz-placeholder{ /* Mozilla Firefox 19+ */
color:white;
}
input:-moz-placeholder{ /* Mozilla Firefox 4 to 18 */
color:white;
}
input:-ms-input-placeholder{ /* Internet Explorer 10-11 */
color:white;
}
4、让动画只播放一次，并且停留在最后一帧?
#box:focus{
animation: mymove 1s ease-in-out 1 forwards;
}
/*:focus伪类表示获得焦点的元素*/
/*mymove 动画名称;ease-in-out缓慢开始和结束;1表示播放一次;forwards表示停留在最后一帧*/
@keyframes mymove {
from {width:260px;}
to{width:320px;}
}
5、点击文本框或按钮会出现蓝色框，怎样去掉?
input{
border:0;
online:none; /*online就是一个提醒选中的效果*/
}
6、关于设置z-index没有作用，或者input文本框无法获取焦点?
在css中，元素的position属性必须是relative，absolute或者fixed，才能通过z-index改变层级;
关于z-index无论设置多高都不起作用的原因和解决方案：
一、
父标签position属性为relative; //改为position：absolute;
问题标签无position属性 //添加position属性(relative、absolute等)
问题标签含有浮动(float)属性; //去除浮动即可
二、IE6下，层级表现有时候不是看子标签的z-index多高，而要看整个DOM tree(节点树)的第一个relative属性标签的父级标签的层级。
虽然问题标签的层级很高，但是由于第一个relative属性的父级标签不给力，所以自身强大也没用。
input文本框无法获取焦点，可能是z-index层级低，被其他层级高的元素所覆盖了。
7、css3动画animation的播放、暂停和重新开始
/*css部分*/
@keyframes mymove{
0%{
margin-left:0px;
}
50%{
margin-left:300px;
}
100%{
margin-left:600px;
}
}
.box{
margin:50px 0;
width:100px;
height:100px;
background:black;
animation: mymove 5s linear 2s infinite normal;
}
/*属性值说明：动画名 播放总时长 播放速度 延迟时间 播放次数 是否轮流反向播放动画*/
/*
播放速度：linear匀速 ease低速-加快-变慢 ease-in低速开始 ease-out低速结束 ease-in-out低速开始和结束
播放次数： n播放n次 infinite无限循环播放
是否轮流播放： normal正常播放，默认值 alternate轮流反向播放
*/
.box:hover {
animation-play-state:paused; /*鼠标移动上去暂停动画;*/
/* paused暂停动画
running继续播放动画
*/
}
8、怎样在新的窗口打开页面链接
target属性规定在何处打开页面上的所有链接
语法：
属性值：_blank 在新窗口打开被链接文档
_self 默认。在相同的框架中打开被链接文档
_parent 在父框架集中打开被链接文档
_top 在整个窗口中打开被链接文档
framename 在指定的框架中打开被链接文档
//直接在开头就设定，所有的链接都会以_blank方式打开
如对本文有疑问， 点击进行留言回复！！
我要评论
网友评论