div、h1 或 p 元素常常被称为块级元素。这意味着这些元素显示为
    一块内容,即“块框”。与之相反,span 和 strong 等元素称为“行
    内元素”,这是因为它们的内容显示在行中,即“行内框”。    
    CSS 有三种基本的定位机制:普通流、浮动和绝对定位。
    除非专门指定,否则所有框都在普通流中定位。也就是说,普通流中
    的元素的位置由元素在 (X)HTML 中的位置决定。
    CSS position 属性:
    static   relative     absolute   fixed

css相对定位
    绝对定位使元素的位置与文档流无关,因此不占据空间。这一点与相
    对定位不同,相对定位实际上被看作普通流定位模型的一部分,因为
    元素的位置相对于它在普通流中的位置。
    
    css浮动
    浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个
    浮动框的边框为止。
    由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得
    就像浮动框不存在一样。
    
    inline:块级元素转行内元素
    block:1、隐藏元素显示2、转块级元素
    inline-block:两者都包含

CSS定位内容的更多相关文章

  1. CSS进阶内容—浮动和定位详解

    CSS进阶内容-浮动和定位详解 我们在学习了CSS的基本知识和盒子之后,就该了解一下网页的整体构成了 当然如果没有学习之前的知识,可以到我的主页中查看之前的文章:秋落雨微凉 - 博客园 CSS的三种布 ...

  2. CSS定位(CSS定位概述、相对定位、绝对定位、浮动)

    CSS 定位属性 CSS 定位属性允许你对元素进行定位. 属性 描述 position 把元素放置到一个静态的.相对的.绝对的.或固定的位置中. top 定义了一个定位元素的上外边距边界与其包含块上边 ...

  3. CSS定位(postion)和移动(float)

    5.定位和移动:Positioning(定位)CSS定位属性允许你为一个元素定位.它也可以将一个元素放在另一个元素后面,并指定一个元素的内容太大时,应该发生什么. 元素可以使用的顶部,底部,左侧和右侧 ...

  4. CSS定位:几种类型的position定位的元素

    当人们刚接触布局的时候都比较倾向于使用定位的方式.因为定位的概念看起来好像比较容易掌握.表面上你确切地指定了一个块元素所处的位置那么它就会坐落于那里.可是定位比你刚看到的时候要稍微复杂一点.对于定位来 ...

  5. UI自动化测试(二)浏览器操作及对元素的定位方法(xpath定位和css定位详解)

    Selenium下的Webdriver工具支持FireFox(geckodriver). IE(InternetExplorerDriver).Chrome(ChromeDriver). Opera( ...

  6. 《css定位 position》课程笔记

    这是我学习课程css定位 position时做的笔记! 本节内容 html的三种布局方式 position可选参数 z-index 盒子模型和定位的区别 侧边栏导航跟随实例 html的三种布局方式 三 ...

  7. 【CSS】 CSS 定位

    css 定位和浮动 *******本章大量内容copy自w3school********* 定位对于html界面还是很重要的,因为定位会直接影响到用户的视图.对于css而言,定位也比较灵活. 浮动是一 ...

  8. CSS 定位 (Positioning) 实例

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

  9. CSS学习总结3:CSS定位

    CSS 定位机制 CSS 有三种基本的定位机制:普通流.浮动和绝对定位. 一.普通流 除非专门指定,否则所有框都在普通流中定位.普通流中元素框的位置由元素在(X)HTML中的位置决定.块级元素从上到下 ...

随机推荐

  1. Django项目开发-小技巧

    当你开发完一个Django项目之后肯定要吧他丢到服务器让跑起来,但是你在自己的环境下安装了好多的包,是不是在服务器中也要一个个的安装了, pip freeze > read.txt #这条命令会 ...

  2. oracle 12c的数据库导进 11g

    从oracle 12c 备份(expdp)出来的包,还原到11g里,想想都知道会有兼容性问题. 果不其然,报错了: ORA-39142: 版本号 4.1 (在转储文件 "叉叉叉.expdp& ...

  3. 2016/2/29 html 思维导图

  4. jquery中一些容易忽略的方法

    jquery.ajaxPrefilter:([dataTypes],handle(options,originalOptions,jqXHR)):在发送请求之前和执行$.ajax之前操作options ...

  5. 获取WiFi MAC地址总结【转】

    本文转载自:http://blog.csdn.net/crazyman2010/article/details/50464256 今天对MAC地址的获取做了一些学习,目前网上获取MAC地址的方法主要如 ...

  6. HDU2121 Ice_cream’s world II —— 最小树形图 + 不定根 + 超级点

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2121 Ice_cream’s world II Time Limit: 3000/1000 MS (J ...

  7. HDU1255 覆盖的面积 —— 求矩形交面积 线段树 + 扫描线 + 离散化

    题目链接:https://vjudge.net/problem/HDU-1255 给定平面上若干矩形,求出被这些矩形覆盖过至少两次的区域的面积. Input输入数据的第一行是一个正整数T(1<= ...

  8. Java 内存管理、JVM 工作原理与 Java 运行时系统

    Java 虚拟机规范中说明:所有的对象实例(all class instances)以及数组都要在堆上分配: the heap is the runtime data area from which ...

  9. AutoIT: 对文件系统的菜单进行操作,有专门的语句WinMenuSelectItem

    对文件系统的菜单进行操作,有专门的语句WinMenuSelectItem: Run("notepad.exe") WinWaitActive("[CLASS:Notepa ...

  10. bzoj 3232 圈地游戏 —— 01分数规划+最小割建图(最大权闭合子图)

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3232 心烦意乱的时候调这道题真是...越调越气,就这样过了一晚上... 今天再认真看看,找出 ...