如果图片超出父空间、想让图片居中
-
子绝父相
图片超出父空间如何让图片居中
1.设置父盒子为相对定位 子盒子绝对定位
2.子盒子
left: 50%;
top: 0;
transform: translate X(-50%);
-
奇淫技巧:(
图片宽度大于父元素宽度,又需要图片等比拉伸的,并且永远显示在中间的)
给父元素设置text align:center
给图片元素设置 margin:0 -100%
设置网站的小图标
1.需要图片
2.<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
3.修改href= 路径为图片的路径
其他
- 设置元素的边框是圆角
border-radius: 50%;
---小圆圈,其实就是给元素添加边框 - 给元素添加透明色
border: 2px solid transparent;
/透明色/---给元素添加透明色
- 让元素两端对齐,并且中间有相等空间间隙
.banner .video>ul{
width: 100%;
height: 100%;
background: yellow;
display: flex; -----------
justify-content: space-between;-------------让元素两端对齐,并且中间有相等空间间隙
}
- 子元素设置了margin属性,父元素也会一起被顶下来
,可以给父元素设置overflow: hidden;来防止被顶下来
注:box-sizing属性是针对设置了边框和padding属性
content>dl{
width: 1200px;
height: 100%;
background: green;
margin: 0 auto;
overflow: hidden;
}
.content>dl>dt{
text-align: center;
margin-top: 40px;
margin-bottom: 30px;
}
子元素设置了margin属性,父元素也会一起被顶下来
,可以给父元素设置overflow: hidden;来防止被顶下来
注:box-sizing属性是针对设置了边框和padding属性
下拉菜单
<option value="163.com">163.com</option>不透明度
Opcity:1;(完全不透明)
Opcity:0;(完全透明)
- 动画简写
animation: move 15s linear infinite normal;
image.png
