CSS定位与CSS属性选择器

从上周的周任务来看,自己的CSS还是学习的不够扎实,所以本周的主要任务是学习CSS定位和CSS属性选择器。CSS 有三种基本的定位机制:普通流、浮动和绝对定位。一般如果不给元指定特定的地方,元素一般会按照普通流来排列,如果设置了特定的地方则按照下面说法排列。


1.绝对定位:使用left,right,top, bottom四种属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位,如果父级元素没有设定位属性,则相对于body左上角来定位

2.相对定位:使用left,right,top,bottom四种属性在正常文档流中偏移自身位置

3.浮动:当时用浮动命令时,被浮动对象就会向左或者向右移动直到遇到边框,在元素浮动后会对下一个元素造成影响,可以用clear来清楚浮动对下一个元素造成的影响

在绝对定位中,如果有元素的重叠则可用z-index来排列先后顺序。


CSS属性选择器:属性选择器可以根据元素的属性及属性值来选择元素。简单属性选择 如果希望选择有某个属性的元素,而不论属性值是什么,可以使用简单属性来进行选择,以前学习选择器一直以为只有id和class,现在具体的看了属性选择器内容,直到id和class并不是唯一的设置样式


这个属性选择中并没有明确的标明所选的名称,但是还是可以修改样式,感觉就像约等于一样,将含有所给属性的类似元素全部选中进行修改,这是之前没有看到过的,感觉这样写可以省掉很多代码。


还有就是做了一个关于padding margin的测试


第二个用的padding属性,将原来规定的框架加宽了,但是margin属性是将元素向右移动

  • 0
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值