美文网首页
Chapter 15 定位元素

Chapter 15 定位元素

作者: Candy374 | 来源:发表于2017-01-20 09:21 被阅读0次

绝对定位

通过px, em, %为单位设定元素的上下左右位置进行定位
(相对于最近的设置了absolute/fixed/relative的父类)否则相对于浏览器窗口

不要在一个样式中同时设定float属性和position: fixed 或者absolute

相对定位

其他网页元素不会占用相对定位元素原来所在的位置,相对定位的元素发生移动之后,原来的位置会留下一个窟窿
它主要是用来给绝对定位设置新的参照点

固定定位

会被锁定在屏幕的某个位置上

静态定位

默认定位

隐藏元素

  • visibility: hidden //不显示元素,在页面上会留下窟窿
  • display: none // 完全消失
  • opacity: 0 //

仅当hover时才显示

<figure class='hat'>
  ![](hat.jpg)
  <figcaption>A picture of hat</figcaption>
</figure>

.hat:hover figcaption {
  display: block;
}

相关文章

  • Chapter 15 定位元素

    绝对定位 通过px, em, %为单位设定元素的上下左右位置进行定位(相对于最近的设置了absolute/fixe...

  • CSS定位

    定位 相对定位 元素框会偏移。 元素保持原状 元素还占原位CSS 相对定位.png 绝对定位 元素框会偏移 元素保...

  • 总结css垂直居中的几种方式,实用

    1.很实用,父元素相对定位,子元素绝对定位 2.父元素相对定位,子元素绝对定位,利用margin。 /*设定水平和...

  • 子元素相对于父元素的绝对定位

    1、参照定位的元素必须是相对定位元素的父元素 2、参照定位的元素必须加入position:relative; 3、...

  • xpath 一些函数的运用

    1,normalize-space(@元素属性)= “定位元素” (去除元素的空格) 2,count (定位元素)...

  • appium元素定位

    appium提供了许多元素定位的方法,如id定位、name定位、class定位、层级定位等。 元素定位方式 id...

  • 定位09-11

    定位 通过position属性来设置元素的定位-可选值: 相对定位: 绝对定位: 固定定位: eg: 元素的层级 ...

  • Day06

    今天学到了什么? 一、定位 1.相对定位(父元素) 2.绝对定位(子元素) 3.固定定位 固定定位效果图 二、元素...

  • 简单介绍CSS定位position属性

    定位 position 属性规定元素的定位类型说明这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过...

  • CSS z-index

    当对多个元素同时设置定位时,定位元素可能会发生重叠。想要调整重叠定位元素的堆叠顺序,可以对定位元素应用z-inde...

网友评论

      本文标题:Chapter 15 定位元素

      本文链接:https://www.haomeiwen.com/subject/vjsvbttx.html