在实际项目中,发现postion这个属性经常使用而且常常很重要,所以总结整理一下知识点

css中postion属性有以下可选值,分别是:static,absolute, fixed, relative,inherit

  • postion:static   无定位

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

该属性是所有元素定位的默认情况,在一般情况下,我们不需要特别地去声明它,但有时遇到继承的情况,我们不愿意元素所继承的属性影响本身,从而可以用postion:static取消继承,即还原元素定位的默认值。

  • postion:absolute  绝对定位

生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

  • postion:fixed 相对于窗口的固定位置

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

元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。

  • postion:relative 相对定位

生成相对定位的元素,相对于其正常位置进行定位。

因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。

  • postion:inherit

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

css的postion属性的更多相关文章

  1. CSS中Position属性

    也许你看到这个标题觉得很简单,确实这是一篇关于CSS中Position属性基础知识的文章,但是关于Position的一些细节也许你不了解. 1.简介 position有五个属性: static | r ...

  2. css标签及属性

    css标签及属性 HTML引入CSS的方法 1.嵌入式  <style type = “text/css”>要写的样式</style> 2.外联式  <link rel ...

  3. CSS之cursor属性

    CSS之cursor属性 今天学习了CSS的cursor属性,第一篇博客就用来总结它吧. cursor属性用于控制光标的显示样式,可取的值有这些: cursor:url()*|{auto|defaul ...

  4. CSS样式常用属性整理

    web工程师是最近5年刚刚兴起的一门高薪职业,人们的专注度越来越高. 那么前端除了学习html标签之外还需要掌握什么知识点呢? 为大家整理了一个和HTML标签密不可分的知识要点--<CSS样式常 ...

  5. CSS中box-sizing属性的理解与部分用法

    今天看了一些关于box-sizing的一些资料,在这里整理一下,希望也能对大家有所帮助. box-sizing是CSS的一个属性,很好的解决了盒模型的相关问题.CSS中的盒模型(Box model)分 ...

  6. 深入理解css中position属性及z-index属性

    深入理解css中position属性及z-index属性 在网页设计中,position属性的使用是非常重要的.有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难. position属性共 ...

  7. CSS Counters 计数属性

    CSS Counters其实就是一计数器,早期在CSS中计数器仅存在于ul和ol元素.如果要使用在div这样的元素上,只能通过list-style-image或者是元素的backgroud-image ...

  8. 利用CSS的@font-face属性 在网页中嵌入字体

    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...

  9. [转] CSS float 浮动属性

    http://www.cnblogs.com/polk6/p/3142187.html CSS float 浮动属性 本篇主要介绍float属性:定义元素朝哪个方向浮动. 目录: 1. 页面布局方式: ...

随机推荐

  1. 【Alpha版本】冲刺阶段——Day6

    [Alpha版本]冲刺阶段--Day6 阅读目录 今日进展 问题困难 明日任务 今日贡献量 TODOlist [今日进展] 为注册模块增加界面代码 public static void Windows ...

  2. Codeforce 270A - Fancy Fence (正多边形)

    Emuskald needs a fence around his farm, but he is too lazy to build it himself. So he purchased a fe ...

  3. Hadoop学习笔记之六:HDFS功能逻辑(2)

    Lease(租约) HDFS(及大多数分布式文件系统)不支持文件并发写,Lease是HDFS用于保证唯一写的手段. Lease可以看做是一把带时间限制的写锁,仅持有写锁的客户端可以写文件. 租约的有效 ...

  4. javaweb笔记—04(预编译和泛型)

    预编译:ps对象1.ps可进行预编译,占位符传值,性能高于sta的(数据库驱动层有优化)2.比较灵活,数据库将预编译的SQL缓存了,第二次访问,就不用预编译,直接执行.3.较为安全,不会发生SQL注入 ...

  5. Server Library [Apache Tomcat 7.0] unbound解决方案

    问题描述: 当在MyEclipse中导入高版本Eclipse的[Eclipse Dynamic Web]项目后,会发现其Java Build Path(选定项目->Alt+Enter即可打开Pr ...

  6. Python调用大漠插件

    Python版本要用32位的?我去官网下载,太慢了,就在腾讯软件里面下载了一个,结果实验成功 import win32com.client dm = win32com.client.Dispatch( ...

  7. Maven 工程读取resource下的文件

    1:方式1: public static List<String> userList; static { userList = new LinkedList<String>() ...

  8. 看起来像是break的考量

    代码运用了if+break: package day20181008; import java.util.Scanner; public class ZuoYe01 { public static v ...

  9. 批量telnet端口通不通

    每读一行就运行一次telnet IP port #!/bin/bash port="22" cat *.txt | while read line do telnet ${line ...

  10. Fedora 全局代理上网设置

    1.首先新建一个bash文件 vim /etc/profile.d/proxy.sh 加入以下内容 (有账号密码) export HTTP_PROXY="http://username:pa ...