起楚永世承，教崇忠孝，志尚宽平
清醒时做事，迷茫时读书，独处时思考，烦躁时运动，得意时淡然，失意时坦然，忙碌时专注，闲暇时蓄力。

css使用总结笔记

position

  1. static: 定位的元素，无特殊定位，遵循正常的文档流对象:

  2. fixed :  相对定位与于（浏览器窗口是固定位置）。

  3. relative: 相对定位与（元素自己原来的位置）

  4. absolute：绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>
  5. sticky：粘性定位的元素是依赖于用户的滚动，在 position:relative 与 position:fixed 定位之间切换（通常用于标题）

 

overflow: auto;  来解决子元素溢出的问题(如浮动列表的父类使用)

　　还可以解决屏幕滑动僵化

     1.微信小程序中的page中加，

     2.html 中的body中添加即可解决

 

display: -webkit-box;      横向滚动 且宽度固定

 css显示一行--多的显示...  
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;

 

css显示两行--多的显示...
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;

 通过display:flex实现CSS垂直居中。

//父类
display:flex;  
//子类
align-self: center;

 

 

 

posted @ 2021-12-24 09:45  一蹴而就  阅读(43)  评论(0)  编辑  收藏  举报