课程:
- 1、CSS相对定位和绝对定位怎么用,两个东西总是不知道什么时候该用哪个
- 2、什么是相对定位什么是绝对定位?什么是浮动?各举例说明(写代码举例,并说明代码执行后的效果)
- 3、position定位absolute和fixed的区别是什么
CSS相对定位和绝对定位怎么用,两个东西总是不知道什么时候该用哪个
实际上很少单独用到绝对定位,分辨率或窗口大小一旦改变,绝对定位的东西就有可能会移动位置影响设计效果,你是无法确定所有人的分辨率都和你制作页面使用的分辨率是一样的。
所以:通常都是相对定位的父元素里面嵌套一个或多个绝对定位的子元素,你可以自己试试,这样就不会因为分辨率、窗口大小变化而错位。
div class="8bd3-f7d5-8d60-dbfc 相对定位"
p class="f7d5-8d60-dbfc-c72d 绝对定位"绝对定位1/p
p class="8d60-dbfc-c72d-e51f 绝对定位"绝对定位2/p
/div
什么是相对定位什么是绝对定位?什么是浮动?各举例说明(写代码举例,并说明代码执行后的效果)
绝对定位就是将某个容器固定在浏览器的某个位置,代码如下:
#box_relative {
position: absolute;
left: 30px;
top: 20px;
}
在 CSS 中,我们通过 float 属性实现元素的浮动。代码如下:
.news img {
float: left;
}
.news p {
float: right;
}
div class="dbfc-c72d-e51f-03c4 news"
img src="news-pic.jpg" /
psome text/p
/div
position定位absolute和fixed的区别是什么
position:absolute是绝对定位,其实position:fixed也是绝对定位的一种扩展或者说变型。
两者都脱离了文档流,但是又有很大的不同点,那就是position:fixed定位的元素会固定原来的位置不变,无论如何拖动滚动条,从fixed这个英文单词的意思也可以看出。