html绝对定位

简介: 父级元素中添加一个相对定位position:relative那么在设置子元素的绝对定位时,子元素就已此为开始设置的参照位置(参照物)

父级元素中添加一个相对定位position:relative那么在设置子元素的绝对定位时,子元素就已此为开始设置的参照位置(参照物)

例如:让子元素相对父元素水平居中

11.jpg<div style="width:1000px;margin:0 auto;height:300px;background:pink;position:relative;">

<div style="width:300px;height:150px;background:red;position:absolute;left:50%;margin-left:-150px;"></div>

</div>



相关文章
html+css实战150-定位-绝对定位
html+css实战150-定位-绝对定位
104 0
html+css实战150-定位-绝对定位
|
前端开发
前端学习 -- Html&Css -- 相对定位 绝对定位 固定定位
相对定位 - 定位指的就是将指定的元素摆放到页面的任意位置,通过定位可以任意的摆放元素。 - 通过position属性来设置元素的定位。 -可选值: static:默认值,元素没有开启定位; relative:开启元素的相对定位; absolute:开启元素的绝对定位; fixed:开启元素的固定定位(也是绝对定位的一种)。
1252 0
|
前端开发
html table td 中 使用相对定位(relative)和绝对定位(absolute)的div
absolute绝对定位的div放在td中,他的定位是相对于table的左上角。 relative相对定位的div放在td总共,他的定位是相对于本td的的左上角。 当把td设置成相对或者绝对定位,所有定位都正常了,也就是说在内层使用定位,外层必须也要使用定位。 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional
2269 0
HTML基础6--定位:绝对定位、相对定位,其他定位和定位问题
HTML中如何设置一个元素所在位置? relative相对定位/定位偏移量 absolute绝对定位/定位层级
726 0
|
7天前
|
XML 前端开发 JavaScript
Html:CSS介绍
Html:CSS介绍
23 1
|
7天前
|
前端开发
Html:CSS的书写位置
Html:CSS的书写位置
17 0
|
2天前
|
前端开发 JavaScript 搜索推荐
打造个人博客网站:从零开始的HTML和CSS之旅
【9月更文挑战第32天】在这个数字化的时代,拥有一个个人博客不仅是展示自我的平台,也是技术交流的桥梁。本文将引导初学者理解并实现一个简单的个人博客网站的搭建,涵盖HTML的基础结构、CSS样式的美化技巧以及如何将两者结合来制作一个完整的网页。通过这篇文章,你将学会如何从零开始构建自己的网络空间,并在互联网世界留下你的足迹。
|
3天前
|
前端开发 JavaScript 搜索推荐
打造个人博客网站:从零开始的HTML与CSS之旅
【9月更文挑战第31天】在这个数字时代,拥有一个个人博客网站是展示自我、分享知识和连接世界的重要方式。本文将引导你通过简单的HTML和CSS知识,一步步构建起你的在线空间。无论你是编程新手还是希望通过实践加深理解,这篇文章都将是你的理想指南。我们将探索基本概念,实现页面布局,并点缀以个性化样式,最终将静态页面转变为动态交互式网站。准备好了吗?让我们开始吧!
|
7天前
|
XML 前端开发 JavaScript
jQuery HTML / CSS 方法
jQuery HTML / CSS 方法
9 2
|
8天前
|
JavaScript 前端开发
JavaScript HTML DOM - 改变CSS
JavaScript HTML DOM - 改变CSS
16 4
下一篇
无影云桌面