-
1、浮动布局 2、绝对定位和相对定位 3、遮罩层透明度变化 4、css3动画效果:transition 5、用伪类实现鼠标悬停时阴影的控制 6、在IE浏览器与标准浏览器下,绑定事件的区别 7、target 8、通过改变<li>的className实现最终效果查看全部
-
用css3实现平滑过渡:.wrapper ul * { transition:all linear 100ms;}查看全部
-
元素的明暗度是控制遮罩层的透明度实现的。 .wrapper:hover .mask { opacity:0.15;} 鼠标悬停的列表项:.wrapper li.big a:hover .mask { opacity:0;}查看全部
-
【虚线的实现方法】 .line { position:absolute; right:0px; width:0px;height:128px;border:1px dashed #ccc;} 由于只需要虚线边框的效果,故该元素的宽度为0。 【遮罩层】 .mask { position:absolute; top:0px; left:0px; height:128px; width:156px; opacity:0; background:#000;} 遮罩层的宽度和高度与列表项的宽高一样,设置背景色和透明度。 为处于展开状态的列表项设置class,单独写效果。 让为展开的图片超出列表项一点。img { right:-15px;}查看全部
-
n个列表项总宽度 = (n-1)*列表项宽度 + 1*展开的列表项宽度查看全部
-
浮动布局; 通过设置一个遮罩层的透明度来改变某个元素的明暗度; javascript属性 / css3的transition 实现动画效果; 监听鼠标事件onmouseover。查看全部
-
bind(list[i], 'mouseover', mouseoverHandler);查看全部
-
<p class="price"><i>1</i>折起</p>查看全部
-
function initList(){ //取得外部元素 var outer = document.getElementById('subject'); //取得每个列表项 var list = outer.getElementsByTagName('li'); //用不了,报错getElementsByTagName of null for(var i =0; i < list.length; i++){ //对每个列表绑定鼠标悬停事件的监听 bind(list[i], 'mouseover', mouseoverHandler); } }查看全部
-
1浮动 2绝对定位和相对定位 3遮罩层 4动画效果:transition 5鼠标悬停时阴影的控制查看全部
-
浮动布局 绝对定位与相对定位(position:absolute 与 position:relative) 遮罩层 明暗度的变化(opacity:0.15) CSS3动画效果——transition(transition:all linear 0.1s) 鼠标悬停时阴影的控制(a:hover{opacity:0;}) 在IE浏览器与标准浏览器下,绑定事件的区别: function bind(el,eventType,callback){ if(typeof el.addEventListener === 'function'){ el.addEventListener(el,eventType,callback,false); }else if(typeof el.attachEvent === 'function'){ el.attachEvent('on' + eventType,callback); } }查看全部
-
图片明暗度是根据控制遮罩层的阴影呈现的。opacity属性查看全部
-
权重越高优先级也就越高查看全部
-
超出的部分隐藏(overflow:hidden) 超出的部分显示(overflow:visible) 隐藏元素(display:none) 视觉隐藏元素(visibility:hidden)查看全部
-
1/1. 并排显示的列表如何实现? A 用div元素绝对定位来实现 B 用div元素display:table来实现 C 用table元素 D 用ul li元素通过左浮动来实现 答案为D,其他方法的确也可以实现,但是都有着各种问题。A答案使用起来不灵活。B答案,是一个取巧的方式但是涉及到兼容性的问题,却不如D 答案,简单有效。C 元素有一些弊端, 文档载入的时候一定要载入完了整个table元素才开始显示列表,对用户不友好。D 是最有效,而且兼容性最好的排列方式查看全部
举报
0/150
提交
取消