HTML5这一段代码是什么意思？

首先纠正一下，你这个是 css 不是 html

.portfolio .label-text{

}

这里的意思是给：类名选择器为 portfolio 的后代的所有 类名选择器为 label-text 的标签设置样式。

里面的样式解析：

position:relative是相对定位的意思，如果它的子级元素设置了 position: absolute

则为子级元素根据当前元素来进行定位，如果子级元素没有设置 position: absolute则为当前元素相对于自身进行定位。

z-index:500这个样式为元素设置堆叠顺序。例如你有几本书，叠着放在桌子上，你一样只能看见最上面的那本，但是你想放那本在最上面呢？ 通过 z-index 就可以设置元素在最上面。

padding:5px 8pxpadding的作用就是设置内边距（也叫内补）第一个参数为设置上和下的内边距分别为 5px , 第二个参数为设置 左 和 右 的内边距分别为 8px；

CSS left 属性用来指定被定位元素左侧边缘的位置。该属性定义了被定位元素左侧外边距边界与其包含块元素左侧边界之间的偏移。

left是一个偏移属性，偏移属性用于指定一个被定位元素的精确位置，对于static的元素没有效果。要使用这个CSS属性，必须为元素设置一个position值，而不能是默认的static定位方式。

在CSS中，可用的偏移属性有四个，包括top、right、bottom和left。

对于绝对定位的元素，即position属性设置为absolute的元素，left属性指定元素左侧边距边缘和包含该元素的容器的左侧边缘的距离。

对于相对定位的元素，即position属性设置为relative的元素，left属性指定元素的左侧边界离开其正常位置的距离。

对于固定定位或sticky定位的元素，left属性指定元素到视口左侧边缘的距离。

官方语法

left: | | auto

参数：

：使用固定的长度值指定元素的左侧偏移。长度值可以参考数据类型。长度值允许为负数。

：使用元素的包含块的百分比值来指定左侧偏移值。百分比值可以参考数据类型。百分比值允许为负数。

auto：当left属性设置为auto的时候，分为两种情况：

如果元素是相对定位的，在水平方向上会根据right属性的值来定位。如果right属性也设置为auto，那么元素在水平方向上不会移动。

如果元素是绝对定位的，在垂直方向上会根据right属性的值来定位。如果元素的宽度设置为auto，那么元素的宽度会随着内容的增加而增长。

left属性的初始值为auto。

left属性可以使用inherit属性从它的父元素中继承左侧偏移值。它的父元素不一定是它的定位上下文。

应用范围

left属性可以应用在所有可以被定位的元素上。

示例代码

/* 使用长度值 */

left: 3px

left: 2.4em

/* 使用元素包含块的百分比值 */

left: 10%

/* 使用关键字 */

left: auto

left: inherit

在线演示

1、在相对定位的元素上使用left属性：

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

2、在绝对定位的元素上使用left属性：

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et

地理位置获取流程：

1、用户打开需要获取地理位置的web应用。

2、应用向浏览器请求地理位置，浏览器d出询问窗口，询问用户是否共享地理位置。

3、假设用户允许，浏览器从设别查询相关信息。

4、浏览器将相关信息发送到一个信任的位置服务器，服务器返回具体的地理位置。

检测浏览器支持：

JavaScript Code复制内容到剪贴板

function loadDemo() {

if(navigator.geolocation) {

document.getElementById(“support”).innerHTML = “HTML5 Geolocation supported.”

} else {

document.getElementById(“support”).innerHTML = “HTML5 Geolocation is not supported in

your browser.”

}

}

位置请求方式：

单次请求

JavaScript Code复制内容到剪贴板

navigator.geolocation.getCurrentPosition(updateLocation, handleLocationError, options)

回调函数updateLocation接受一个对象参数，表示当前的地理位置，它有如下属性：

latitude——纬度

longitude——精度

accuracy——精确度，单位米

altitude——高度，单位米

altitudeAccuracy——高度的精确地，单位米

heading—运动的方向，相对于正北方向的角度

speed——运动的速度（假设你在地平线上运动），单位米/秒

回调函数handleLocationError接受错误对象，error.code是如下错误号。

UNKNOWN_ERROR (error code 0) —— 错误不在如下三种之内，你可以使用error.message获取错误详细信息。

PERMISSION_DENIED (error code 1)—— 用不选择不共享地理位置

POSITION_UNAVAILABLE (error code 2) ——无法获取当前位置

TIMEOUT (error code 3) ——在指定时间无法获取位置会触发此错误。

第三个参数options是可选参数，属性如下：

enableHighAccuracy——指示浏览器获取高精度的位置，默认为false。当开启后，可能没有任何影响，也可能使浏览器花费更长的时间获取更精确的位置数据。

timeout——指定获取地理位置的超时时间，默认不限时。单位为毫秒。

maximumAge——最长有效期，在重复获取地理位置时，此参数指定多久再次获取位置。默认为0，表示浏览器需要立刻重新计算位置。

---