定位

一、介绍：

position设置块级元素相对于其父块的位置和相对于它自身应该在的位置，任何使用定位的元素都会成为块级元素。

1、属性值

属性值 描述
absolute

生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。如果元素没有已定位的父元素，那么它的位置相对于<html>【即相对与页面的上、左边框】；元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
fixed 生成固定定位的元素，相对于浏览器窗口进行定位，即使窗口是滚动的，它也不会移动。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
relative 生成相对定位的元素，相对于其正常位置【或父类元素】进行定位。因此，"left:20" 会向元素的 LEFT 位置添加 20 像素（可以为负数）。
static 默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。
inherit

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

二、元素定位

1、a元素相对b元素定位

语法

a元素{

	position: relative;

      }

b元素{

	position: absolute;

     }

 

HTML5：定位的更多相关文章

  1. html5定位getLocation()

    HTML5 Geolocation API 用于获得用户的地理位置. 如果用户不允许定位,那么用户信息是不可用的. 获取用户的位置:getCurrentPosition() 返回数据如下 返回用户当前 ...

  2. 利用HTML5定位功能，实现在百度地图上定位

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 利用HTML5定位功能，实现在百度地图上定位（转）

    原文:利用HTML5定位功能,实现在百度地图上定位 代码如下: 测试浏览器:ie11定位成功率100%,Safari定位成功率97%,(add by zhj :在手机上测试(用微信内置浏览器打开),无 ...

  4. HTML5定位使用心得

    最近项目中接到一个需求,需要使用百度地图API和HTML5定位特性. 对于百度地图API,没啥好说的,刨它的API就是了. 今天想说说JS定位特性. 浏览器支持 Internet Explorer 9 ...

  5. HTML5定位功能，实现在百度地图上定位

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. html5定位并在百度地图上显示

    在开发移动端 web 或者webapp时,使用百度地图 API 的过程中,经常需要通过手机定位获取当前位置并在地图上居中显示出来,这就需要用到html5的地理定位功能. navigator.geolo ...

  7. html5定位获取当前位置并在百度地图上显示

    用html5的地理定位功能通过手机定位获取当前位置并在地图上居中显示出来,下面是百度地图API的使用过程,有需要的朋友可以参考下 在开发移动端 web 或者webapp时,使用百度地图 API 的过程 ...

  8. html5 定位 获得当前位置的经纬度

    if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition, showError, { // ...

  9. html5 定位

    需要实现的功能:移动端的网页,能定位到中文地址. 百度地图能实现这样的功能. 之前精度差得原因是,我用自己的mac做服务器,用手机来浏览定位,这样只能定位到mac 的地址,mac上浏览器的地址就没准了 ...

  10. 让HTML5来为你定位（转）

    add by zhj: HTML5的地理定位返回的应该都是GPS坐标,即WGS-84坐标,参见Map Types - Google Maps JavaScript API v3 本文使用的是Chrom ...

随机推荐

  1. python 减少可调用对象的参数个数

    有一个被其他python 代码使用的callable 对象,可能是一个回调函数或者是一个处理器,但是它的参数太多了,导致调用时出错 如果需要减少某个函数的参数个数, 你可以使用functools.pa ...

  2. flask 定义数据库关系（一对一）

    一对一 我们将使用国家和首都来演示一对一关系:每个国家只有一个首都.反过来,一个城市也只能作为一个国家的首都.一对一关系如下: 在示例程序中,Country类表示国家,Capital类表示首都.建立一 ...

  3. Appium+python自动化1-环境搭建（上）

    前言 appium可以说是做app最火的一个自动化框架,它的主要优势是支持android和ios,另外脚本语言也是支持java和Python.小编擅长Python,所以接下来的教程是appium+py ...

  4. HTML5中 audio标签的样式修改

    由于html5的流行,现在移动端大多数的需求都可以使用audio来播放音频,但您可能只是需要很简单的播放/停止效果,但不同的浏览器上的audio样式却不尽人意,那么要怎么改变这个样式呢,其实它的原理比 ...

  5. 文件上传中UUID的解读

    UUID简介如下:1.简介UUID含义是通用唯一识别码 (Universally Unique Identifier),这 是一个软件建构的标准,也是被开源软件基金会 (Open Software F ...

  6. Docker 部署 portainer

    Docker 部署 portainer 环境: docker 版本 :18.09.1 主机地址:192.168.1.81 一.部署 porttainer 1.修改docker配置文件,开放端口. vi ...

  7. oracle addm报告

    可通过@?/rdbms/admin/addmrpt.sql生成ADDM报告 ADDM本身并不是很实用,抽象级别太高,用于初步判断系统配置/IO子系统是否合理和快速参考,一个报告截图如下: 任务 '任务 ...

  8. JS设计模式（4）迭代器模式

    什么是迭代器模式? 定义:提供一种方法顺序访问一个聚合对象中各个元素, 而又无须暴露该对象的内部表示. 主要解决:不同的方式来遍历整个整合对象. 何时使用:遍历一个聚合对象. 如何解决:把在元素之间游 ...

  9. 安装cmake

    $ sudo apt-get install build-essential$ wget http://www.cmake.org/files/v3.11/cmake-3.11.3.tar.gz$ t ...

  10. web前端除了关注代码功能实现,还应具备web性能优化以及SEO优化的常识

    web前端除了关注代码功能实现,还应具备web性能优化以及SEO优化的常识 ——不会WPO.SEO的前端工程师不是好码农 作为一名web前端工程师,除了要实现上级的要求,满足其所需要的功能,还要在平时 ...