为什么80%的码农都做不了架构师?>>>   CSS常用遮罩层 应用场景: 上传了一张图片,鼠标移入到图片上的时候显示遮罩层,并且提示点击删除. 通过改变遮罩层的透明度来实现显示隐藏提示信息 <div class="parent"> <img src="" > <div class="mask">点击删除图片</div> </div> 下面是CSS .mask { po…
使用元素的opacity 属性,设置遮罩层的效果, 主要 样式是:background-color: #ooo; opacity:0.3; <div style="width:500px; height:500px;position:fixed; top :0px;background-color:#000;opacity:0.3;text-align:center"> <div style="float:right; width:100px;height:…
模态框: html部分: <!-- 按钮 --> <button id="box" onclick="pop_box()">弹出框</button> <!-- 弹出模态框 --> <div class="div-container" id="div-container" style="display: none;"> <div class=&…
如何在一个div内将一个div进行绝对定位呢?很简单,把父div的position属性设为relative,子div的position属性设为absolute就可以了... 示例: <html> <body> <div>xxxxx<div> <div style="border:1px red solid;width:100%;height:50px;position:relative"> <div style=&quo…
来自网络摘抄 原始代码 <style> #div1{border:1px solid red;float:left;} #div2,#div3{float:right;border:1px solid blue;} </style> <div id="div1"> <div id="div2">two</div> <div id="div3">one</div>…
<%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3…
从今天起 开始细话div布局   思路及要点: 父div的位置设置成相对的,即“position: relative;”. 而子div的位置设置成绝对的,并且下边缘设为0,即“position: absolute; bottom: 0;”.   代码 <head> <title>子div在父div中置底</title> <style type="text/css"> .father { width: 500px; height: 600p…
马上月底了, 这个月忙于工作和生活, 没有很好的写一篇博客, 有点忧伤. 为了弥补, 就写点简单的. 最近项目有个需求, 就是鼠标移入的时候显示一个层, 移除的时候这个层消失. 当然层是可以点击进行额外操作的. 项目用的是react,最开始使用的是mounseenter和mounseleave事件, 结果吧出现了点击进入另外一个路由后,再次点击回来后, 鼠标在元素上, 确没有再出现浮层. 这就有尴尬了. 当时还想用的是事件, 但想想现在css3鼠标事件, 动画, 伪类选择器这么成熟了. 额外去搜…
有如下div: <div id='pop-div' class="pop-box"> <div class="input-group has-info"> <input class="form-control" id="bankCode" type="text" placeholder="请输入银行卡号" /> <span class="…
.PopUp_layer{   position:fixed;   top: 0;   left: 0;   right:0;   bottom:0;   width:100%;   height:100%;   background:rgba(0,0,0,0.6);   background:#000\9;/*CSS Hack,只能对ie9以下浏览器ie6,ie7,ie8有效,否侧ie10,FF,Cherome会失去透明效果*/   filter:Alpha(opacity=60);/*只对i…