0805自我总结

一.绝对定位

position: absolute;

/*绝对定位:
1、定位属性值:absolute
2、在页面中不再占位(浮起来了),就无法继承父级的宽度(必须自己自定义宽度)
3、一旦定位后,定位的布局方位 top、bottom、left、right都能参与布局
4、绝对定位的参考系是最近的定位父级(不是父级中的哪一点,而是四边参照四边)
5、左右同时存在,取左;同理上下取上
6、当父级定位了,子级参照父级定位,又可以重新获取父级宽度(也可以在计算中拿到父级高度)
*/

position:fixed

生成绝对定位的元素,相对于浏览器窗口进行定位。

二.相对定位

position: relative;

父级(最近的一个父级)相对定位的目的

1)不影响自身布局

2)辅助自己绝对定位布局

三默认定位

position: static

默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。

四.继承定位

position:inherit

规定应该从父元素继承 position 属性的值。

五.滚动条

overflow

  • hidden:没有滚动条,且内容只有规定区域的内容.

  • visible:默认值没有滚动条,这个属性定义溢出元素内容区的内容会如何处理且显示.

  • scroll:这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条.

  • auto:显示滚动条,且内容只有规定区域的内容.

CSS定位和滚动条的更多相关文章

  1. CSS 定位 (Positioning) 实例

    CSS 定位和浮动CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠,还可以完成多年来通常需要使用多个表格才能完成的任务. 定位的基本思想很简单,它允许你 ...

  2. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  3. 第八篇 CSS定位

    CSS定位 CSS除了内外边距控制元素,还有定位,看到“定位”两个字,同学们应该就能清楚,它能够做什么.   在刚学习的时候,我也经常使用定位,来控制元素的位置,但是初学的同学可能会注意不到定位的一些 ...

  4. CSS 定位 (Positioning)

    CSS 定位 (Positioning) 属性允许你对元素进行定位. CSS 定位和浮动 CSS 为定位和浮动提供了一些属性,利用这些属性,可以建立列式布局,将布局的一部分与另一部分重叠,还可以完成多 ...

  5. CSS定位布局

    CSS定位布局 基础知识 在CSS布局中,定位布局也是一种非常常见的技术手段,我们以京东为例: 上面是非常好的例子,对于定位布局来说它可以将一个元素放在页面上的任意一个位置. 但是定位布局也不能滥用, ...

  6. css定位

    文档流 所谓的文档流,指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列.并最终窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素.脱离文档流即是元素打乱了这个排列,或是从排版 ...

  7. 常用的CSS定位,XPath定位和JPath定位

    CSS定位 举例 描述 div#menu id为menu的div元素 div.action-btn.ok-btn class为action-btn和ok-btn的div元素 table#emailLi ...

  8. div+css定位position详解

    div+css定位position详解 1.div+css中的定位position 最主要的两个属性:属性 absolute(绝对定位) relative(相对定位),有他们才造就了div+css布局 ...

  9. CSS 定位

    一.CSS 定位和浮动   它们代替了多年来的表格布局.   定位的思想很简单,相对于正常位置.相对于父元素.另一个元素甚至是浏览器窗口的位置.   浮动在 CSS1 中被首次提出.浮动不完全是定位, ...

随机推荐

  1. 《Java基础知识》Java方法重载和重写

    重写(Override) 重写是子类对父类的允许访问的方法的实现过程进行重新编写, 返回值和形参都不能改变.即外壳不变,核心重写! 重写的好处在于子类可以根据需要,定义特定于自己的行为. 也就是说子类 ...

  2. 构建 CDN 分发网络架构简析

    构建 CDN 分发网络架构 CDN的基本目的:1.通过本地缓存实现网站的访问速度的提升 CDN的关键点:CNAME在域名解析:split智能分发,引流到最近缓存节点

  3. linux系统centos7安装最新版本nginx

    一.准备环境 1.安装centos,一般买一个阿里云测试 2.下载nginx,链接http://nginx.org/download/nginx-1.10.2.tar.gz 二.开始安装 1.cent ...

  4. C#字符串与时间格式化

    需要将其它类型的变量,转换为字符串类型的一些常见方法与属性. 字符型转换为字符串 // C 货币 2.5.ToString("C"); // ¥2.50 // D 10进制数 .T ...

  5. HCTF_2018-Writeup【web题】

    HCTF_2018-Writeup 赛题来自:BUUCTF By:Mirror王宇阳 WarmUp: 打开赛题的页面源码(F12) <!DOCTYPE html> <html lan ...

  6. ABAP分享六 alv显示的几种方式的简单示例

    方法1,也是大家常见的方法通过函数   REUSE_ALV_GRID_DISPLAY TYPES: BEGIN OF  ty_spfli,   "定义结构     carrid like s ...

  7. windows下MySQL解压版安装

    MySQL的安装 一.前期准备 获取MySQL解压版安装包(本文使用的是 [mysql-5.7.28-winx64.zip]版本) 获取方式: 通过官网下载,官方下载地址:“https://dev.m ...

  8. 面试连环炮系列(三):synchronized怎么用的

    synchronized怎么用的? 用过,synchronized是常用的并发控制关键字,简单的说就是访问加锁.它可以修饰静态方法或者一个类的class对象,这叫类锁:可以修饰普通方法或者代码块,这叫 ...

  9. k8s采坑记 - 解决二进制安装环境下证书过期问题

    前言 上一篇k8s采坑记 - 证书过期之kubeadm重新生成证书阐述了如何使用kubeadm解决k8s证书过期问题. 本篇阐述使用二进制安装的kubernetes环境,如何升级过期证书? k8s配置 ...

  10. Android——application全局类的使用

    目录 1.概述 2.Application基类 3.自定义Application类 4.Application的生命周期 5.Application对象的回调函数 6.Application对象的作用 ...