定位

一、介绍:

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. javascript时间处理

    1.将一般格式时间转换为时间戳: var systime = "2018年04月28日 16:01:09"; systime = systime.replace('年', &quo ...

  2. numpy linalg模块

    # 线性代数# numpy.linalg模块包含线性代数的函数.使用这个模块,可以计算逆矩阵.求特征值.解线性方程组以及求解行列式等. import numpy as np # 1. 计算逆矩阵# 创 ...

  3. Html 标签初知

    Html 标签初知 什么是Html 标签 超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一 ...

  4. FL studio钢琴卷工具简介

    FL studio中的钢琴卷工具在业内各编曲软件中享有当之无愧的声誉.钢琴卷是一款将音符和自动数据发送到钢琴卷的频道相关联的插件.而钢琴卷的这个操作运行过程被称为“排序”. 下面给大家介绍讲解钢琴卷中 ...

  5. devm_kzalloc【转】

    本文转载自:https://blog.csdn.net/liuhuahan/article/details/42145507 看内核代码的时候看到这个函数不理解它的具体作用然后就上网上查,但是网上只查 ...

  6. P3181 [HAOI2016]找相同字符

    思路 广义SAM 把两个字符串建成广义SAM,然后统计两个SAM中相同节点的endpos大小乘积即可 记得开long long 代码 #include <cstdio> #include ...

  7. Unity3D_UGUI判断鼠标或者手指是否点击在UI上

    比如战斗场景,UI和3D场景同时都需要响应触摸事件,如果同时响应可能就会出现触摸UI的时候影响到了3D部分.为了解决这个问题在判断3D响应之前要先判断手指是否点击在UI上. 以前NGUI的时候都是自己 ...

  8. Redis学习--Redis的安装与Jedis的简单使用

    Redis安装 关于软件安装,之前是通过记录视频,前段时间发现可以直接阅读官网进行安装,这步省略 启动:前端启动直接启动src目录下redis-server,后端启动修改redis.conf中daem ...

  9. Gson如何解析key值是数字的json数据

    1.使用注解@SerializedName来解决这个问题 2.比如有如下json数据:(key值是数字"1112") { "1112": "抖音&qu ...

  10. 使用Gitlab实现自动化部署与持续集成

    Gitlab-Ci运行原理: 由以下两个模块组成gitlab-ci servergitlab-ci-runner其中,gitlab-ci server负责调度.触发Runner,以及获取返回结果. 而 ...