【marginCollapse之兄弟关系的DIV】的更多相关文章

marginCollapse之兄弟关系的DIV

废话不说,直接上图 基本代码如下: 效果图如下: 给两个div分别加marginBottom和marginTop看一下效果 实际效果如下: 我们可以看出两个div之间的距离并不是50+50,而是只显示了一个50:原因和上一遍文章一样,两个margin值重叠了,并且只显示最大的一个. 解决方案: 1.两个div中的任意一个加“display:inline-block”: 如果两个div需要横向加margin,如红色的加margin-right,蓝色的加margin-left时的解决方案如下: 1.…

margin collapse 之父子关系的DIV

打算花点时间将知识整理一下,虽然平时现用现查都能完成工作,可是当遇到面试这种事情的时候,临时查就来不及了... 关于margin,整理若干知识点如下: 一:父子关系的DIV标签以及未加margin时的样式 然后我们给父级和子集都加上margin如下: 实际效果如下: 我们会发现,蓝色的div的marginTop并没有起作用,这个就是所谓的marginCollapse(边界重叠),只计算二者最大的margin值进行显示,之前写Css的时候也常遇见,却不知道还有这么高大上的名字...惭愧. 整理解决…

appium通过同级别(兄弟关系)元素找到元素

在做appium测试用例的时候,要获取金额值,用uiautomatorviewer查看该元素,该元素没有特别明显的个性特点,唯一有特点的定位是有content-desc值,但是该值是变动的,所以无法通该元素自身特点来找到该元素.元素如下图: 既然无法通过自身查找元素,发现也无法通过上一级元素定位,后面发现底部的按钮“我的资产(元)”算是这个页面比较有特殊的,并且肯定能定位到的,再查看“我的资产(元)”元素和金额元素是同一个级别的,这样就能通过xpath的兄弟关系找到金额元素,关系如下: 怎样通过…

浏览器console中加入jquery，测试选择元素

一.chrome浏览器F12打开调试界面,在console中输入(firefox同样可以): var jquery = document.createElement('script'); jquery.src = "http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js";//若调试页面是https的这里也修改为https. document.getElementsByTagName(].appendChild(jquery); jQ…

CSS的引入方式和复合选择器

CSS的引入方式 样式表 优点 缺点 范围 行内样式表 书写方便 结构样式混写 控制一个标签 内部样式表 部分结构和样式相分离 没有彻底 控制一个页面 外部样式表 完全实现结构和样式分离 需要引入 控制多个页面 <link rel="stylesheet" href="a.css"> <!-- href="路径" --> emmet 语法 快速生成HTML标签 生成多个标签:div*****10 有父子级关系的标签:ul…

CSS2系列：外边距合并问题(margincollapse)

外边距合并 w3介绍这个问题地址:https://www.w3.org/TR/CSS2/box.html#collapsing-margins 当两个垂直方向外边距相遇,它们将形成一个折叠外边距. 合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者. 为了好认识,我们称内部div为"盒子",包含这个内部div的外部div为"包含体" 解释 怎么相遇: 相邻的两个盒子(可能是兄弟关系也可能是包含关系)这两个元素margin之间不能夹杂着边框啊,补白啊什么的就…

JavaScript---网络编程(7)-Dom模型(节点间的层次关系,节点的增、删、改)

利用节点间的层次关系获取节点: 上一节讲了3中获取的方式: * ※※一.绝对获取,获取元素的3种方式:-Element * 1.getElementById(): 通过标签中的id属性值获来取该标签对象 * 2.getElementsByName(): 通过标签中的name属性值来获取该标签对象集合 * 3.getElementsByTagName(): 通过标签名来获取该标签对象集合 现在来看看相对获取的方式: ※※二.相对获取(利用节点之间的层次关系),获取节点:-Node 1.父节点:pa…

HTML DOM元素关系与操作

<html> <head><title>DOM元素关系与操作</title></head> <body> <!-- div水平居中--> <div class="content" id="div1"> <div id="div2" class="h_center">水平居中</div> </div>…

最详细的div边距合并的问题和解决方法

对于前端来说写页面是最基础的东西了,但是想不到还是有人不理解边距合并的问题,昨天有网友问我为什么设置的margin不是我设置的实际效果? 好吧,废话不多说,下面来说一下关于margin合并的问题. 解决margin合并的方法有好多种: 首先说一下嵌套关系的margin合并问题. 1.给父元素添加padding-top值和padding-bottom值 2.给父元素添加border值 3.给父元素添加属性overflow:hidden 4.给父元素或者子元素声明浮动float 5.给父元素添加属性…

Python selenium —— 父子、兄弟、相邻节点定位方式详解

今天跟大家分享下selenium中根据父子.兄弟.相邻节点定位的方法,很多人在实际应用中会遇到想定位的节点无法直接定位,需要通过附近节点来相对定位的问题,但从父节点定位子节点容易,从子节点定位父节点.定位一个节点的哥哥节点就一筹莫展了,别急,且看博主一步步讲解. 1. 由父节点定位子节点最简单的肯定就是由父节点定位子节点了,我们有很多方法可以定位,下面上个例子: 对以下代码: <html> <body> <div id="A"> <!--父节点…