问题总结:

1. checkbox和下面隐藏的div对齐,是在清除了默认样式的前提下,而不需要额外设置float: left;

2. 隐藏的div这里不需要专门设置宽高、居中,是靠内容和padding撑起来的尺寸。外层div居中,内层跟着居中。

<style>
*{margin:0;padding:0;} // 后来添加的
body{
font-size: 12px;
}
#outer{
margin: 10px auto;
width: 180px;
}
/* #login input, #display{
float: left;
} */
#display{
background-color: yellow;
border: 1px solid orangered;
margin-top:5px;
padding: 5px;
display: none; /* width: 180px;
height: 30px;
margin: 5px auto; */
}
</style>

CSS笔记 - fgm练习 - 鼠标移入移出div显示隐藏 CSS样式部分的更多相关文章

  1. JS学习笔记 - fgm练习 - 鼠标移入/移出div样式改变

    思路: div的默认样式正常设置. 鼠标移入时,发生改变的样式有3个,即 边框颜色,div背景色,字体颜色. 把这三个css改变设置在一个类名下,再通过js给div动态 添加/去除这个类名,实现div ...

  2. angularjs鼠标移入移出实现显示隐藏

    <tr ng-repeat="item in items track by $index"> <td data-title="操作" alig ...

  3. setTimeout应用例子-移入移出div显示和隐藏

    效果:移入div1,div2保持显示,移出div1,div2消失. 移入div2,div2保持显示,移出div2,div2消失. 一.HTML代码 <div id='div1'></ ...

  4. 鼠标移入 移出div div会消失的处理

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. div展现与收起效果(鼠标移入移出)

    效果图: 移入: 移出: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  6. 函数传参,改变Div任意属性的值&&图片列表:鼠标移入/移出改变图片透明度

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. CSS3鼠标移入移出图片生成随机动画

    今天分享使用html+css3+少量jquery实现鼠标移入移出图片生成随机动画,我们先看最终效果图(截图为静态效果,做出来可是动态的哟) 左右旋转 上下移动 缩放 由于时间关系我就不一步步解析各段代 ...

  8. Vue 鼠标移入移出事件

    Vue 中鼠标移入移出事件 @mouseover和@mouseleave 然后绑定style   现在开始代码示例 <template> <div class="pc&qu ...

  9. jquery事件一 ---鼠标移入移出

    比较一下几个jquery事件的区别 mouseover() 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) m ...

随机推荐

  1. 洛谷——P1043 数字游戏

    https://www.luogu.org/problem/show?pid=1043 题目描述 丁丁最近沉迷于一个数字游戏之中.这个游戏看似简单,但丁丁在研究了许多天之后却发觉原来在简单的规则下想要 ...

  2. 洛谷 P1324 矩形分割

    P1324 矩形分割 题目描述 出于某些方面的需求,我们要把一块N×M的木板切成一个个1×1的小方块. 对于一块木板,我们只能从某条横线或者某条竖线(要在方格线上),而且这木板是不均匀的,从不同的线切 ...

  3. PMP杂谈--制约因素与如果条件

     制约因素和如果条件都是项目范围说明书的内容.它们是项目范围基准的一部分,是定义活动.估算活动持续时间.制定进度计划.估算成本.制定预算.识别风险和规划採购等多个过程的输入. 差别:制约因素是确定 ...

  4. 在JAVA中怎样跳出当前的多重嵌套循环?

    在JAVA中怎样跳出当前的多重嵌套循环?         这道题是考察大家对于break语句的应用.同一时候也是对你多重嵌套循环的使用进行考察.在java中,要想跳出多重循环,能够在外循环语句前面定义 ...

  5. 记真实自己,炫精彩人生---《爱记》app使用体验

    真的有款神器吗,能找到合适的Ta,能秀出自己的新生活,能让自己的心情舒爽,有,体验了下.就是爱记.果粉的福利. [爱记]是集心情记录.分享.评价与交流于一体的工具,TA是你心灵休憩的港湾,也是你记忆放 ...

  6. 1.Maven之(一)Maven是什么

    转自:https://blog.csdn.net/xhxmister/article/details/79409208 首先,Maven的正确发音是[ˈmevən],而不是“马瘟”以及其他什么瘟.Ma ...

  7. 2017国家集训队作业[arc082d]Sandglass

    2017国家集训队作业[arc082d]Sandglass 题意: ​ 有一个沙漏,初始时\(A\)瓶在上方,两个瓶子的最大容量都为\(X\)克,沙子流动的速度为\(1g\)每单位时间.给出\(K\) ...

  8. PLSQL乱码&TNS-12557: protocol adapter not loadable解决

    PLSQL乱码&TNS-12557: protocol adapter not loadable解决 PLSQL乱码&TNS-12557: protocol adapter not l ...

  9. hdu 1533 Going Home 最小费用最大流 入门题

    Going Home Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Tota ...

  10. Ubuntu 14 中给 APACHE2安装 SSL 模块 Enable SSL site on Ubuntu 14 LTS, Apache 2.4.7:

    Ubuntu 14 中给 APACHE2安装 SSL 模块 Enable SSL site on Ubuntu 14 LTS, Apache 2.4.7: 参考 http://blog.csdn.ne ...