响应式 字体设置 flex 弹性布局


 响应式 文字的设置

rem 案例

 

em  案例

       

 flex布局添加的小知识点

 

 

二.flex布局

 

     容器的属性(父级添加的属性)

   1. flex-direction:规定里面的子项目是如何排列的

    

row 决定里面的子项目事如何排列的

 

 2. Flex-wrap属性:决定子元素在一条轴线上放不下,是否换行

 3.justify-content:定义了项目在主轴上的对齐方式

 

 

 4.align-items:定义项目在交叉轴上如何对齐

 

 

5 . Align-content:规定交叉轴方向的对齐方式

 

 在项目上(子集)设置的属性  order flex-grow 

1.order属性 :定义项目的排列顺序;

2.flex-grow属性:定义项目的放大比例  (flex-shrink:定义项目的缩小比例)

 设置头部脚部时设置 flex-grow:1 

 

 3.flex-basis属性

  

4.align-self属性:允许单个项目有与其他项目不一样的对齐方式

   

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM