利用reverse索引优化like语句的方法

PAT Basic Level 1070 结绳 解题思路及AC代码 v1.0

  返回  

移动端重要知识点

2021/8/20 11:26:06 浏览:

meta 标签   

name这个属性指定  viewport  视口

content     width=device-width 布局宽度 等于设备的宽度

                  initial-scale=1  页面的初始化值 1是正常显示  2放大两倍显示的

                  user-scalable=1   是否允许用户缩放,1和yes是允许缩放 ,0 和no是不允许用户缩放

                  maximum-scale = 2  最大放大的倍数

                  minimum-scale = 1  最小能缩几倍

/*去除 移动端 超链接点击高亮问题*/

-webkit-tap-heighlight-color:tranparent;

媒体查询:

使用min-widht  要从小往大写

使用max-width 要从大往小写

em 是相对单位,参照物是父元素的字体大小

rem 的参照物 html的字体尺寸

scss

scss声明变量,使用$

/*! */

引入外面的scss文件  @import "路径/文件名"

@import "aa";

定义混合 @mixin 名

使用混合 @include

继承  @extend

for(var i=1; i<10;i++)   ==  $i from  1    

   i<10;    1 to 10       不包含10

   i<= 10;   1 through 10   包含10

i++  

swiper插件

如果需要分页器 -->

<div class="swiper-pagination"></div>

如果需要导航按钮

<div class="swiper-button-prev"></div>

<div class="swiper-button-next"></div>

如果需要滚动条

<div class="swiper-scrollbar"></div>

direction: 'vertical', // 垂直切换选项

loop: true, // 循环模式选项

speed:1000,  //切换图片滑动的速度

delay: 2000,  //每隔多少毫秒切换一次图片

swiper:

第一步 引入css和js文件

第二步创建div

第三部实例化,修改参数

常见手机屏幕尺寸

超小屏一般是手机端   <768px     xs     extra    small

小屏   平板          >= 768px    sm     small

中等屏幕(桌面显示器, >=992px)  md      middle

大屏幕(大桌面显示器, >=1200px)  lg     large

bootstrap

col-xs-offset-3  设置偏移量

hidden-xs      设置元素消失(隐藏)

visible-lg     设置元素在哪个屏幕尺寸下可见(其他尺寸就自动隐藏)

Flex布局

flex-direction

属性决定主轴的方向(即项目的排列方向)

row(默认值):主轴为水平方向,起点在左端。(类似于左浮动)

row-reverse:主轴为水平方向,起点在右端。(类似于右浮动)

column:主轴为垂直方向,起点在上沿。(从上往下竖着排列)

column-reverse:主轴为垂直方向,起点在下沿。(从下往上竖着排列)

flex-wrap

默认情况下,项目都排在一条线(又称”轴线”)上,如果一条轴线排不下,如何换行

nowrap(默认):不换行

wrap:换行,第一行在上方

wrap-reverse:换行,第一行在下方。

flex-flow

flex-flow属性是flex-direction属性和flex-wrap属性的简写形式,默认值为row nowrap

flex-flow: <flex-direction> || <flex-wrap>;

例如 flex-flow:row nowrap

justify-content

justify-content属性定义了项目在主轴上的对齐方式

属性值右后面五中

flex-start | flex-end | center | space-between | space-around

flex-start(默认值):左对齐

flex-end:右对齐

center: 居中

space-between:两端对齐,项目之间的间隔都相等。

space-around:每个项目两侧的间隔相等。所以,项目之间的间隔比项目与边框的间隔大一倍

align-items

align-items属性定义项目在交叉轴上如何对齐。

align-items: flex-start | flex-end | center | baseline | stretch;

flex-start:交叉轴的起点对齐。

flex-end:交叉轴的终点对齐。

center:交叉轴的中点对齐。

baseline: 项目的第一行文字的基线对齐。

stretch(默认值):如果项目未设置高度或设为auto,将占满整个容器的高度

align-content

align-content属性定义了多根轴线的对齐方式。如果项目只有一根轴线,该属性不起作用。

flex-start:与交叉轴的起点对齐。

flex-end:与交叉轴的终点对齐。

center:与交叉轴的中点对齐。

space-between:与交叉轴两端对齐,轴线之间的间隔平均分布。

space-around:每根轴线两侧的间隔都相等。所以,轴线之间的间隔比轴线与边框的间隔大一倍。

stretch(默认值):轴线占满整个交叉轴。

项目属性:

order属性定义项目的排列顺序。数值越小,排列越靠前,默认为0

order: 整数;

flex-grow属性定义项目的放大比例,默认为0,即如果存在剩余空间,也不放大

如果所有项目的flex-grow属性都为1,则它们将等分剩余空间(如果有的话)。如果一个项目的flex-grow属性为2,其他项目都为1,则前者占据的剩余空间将比其他项多一倍。

flex-shrink属性定义了项目的缩小比例,默认为1,即如果空间不足,该项目将缩小

如果所有项目的flex-shrink属性都为1,当空间不足时,都将等比例缩小。如果一个项目的flex-shrink属性为0,其他项目都为1,则空间不足时,前者不缩小。

注意:负值对该属性无效。

flex-basis属性定义了在分配多余空间之前,项目占据的主轴空间(main size)。浏览器根据这个属性,计算主轴是否有多余空间。它的默认值为auto,即项目的本来大小

它可以设为跟width或height属性一样的值(比如350px),则项目将占据固定空间

flex属性是flex-grow, flex-shrink 和 flex-basis的简写,默认值为0 1 auto。后两个属性可选

该属性有两个快捷值:auto (1 1 auto) 和 none (0 0 auto)。

建议优先使用这个属性,而不是单独写三个分离的属性,因为浏览器会推算相关值

align-self属性允许单个项目有与其他项目不一样的对齐方式,可覆盖align-items属性。默认值为auto,表示继承父元素的align-items属性,如果没有父元素,则等同于stretch

align-self: auto | flex-start | flex-end | center | baseline | stretch;

联系我们

如果您对我们的服务有兴趣,请及时和我们联系!

服务热线:18288888888
座机:18288888888
传真:
邮箱:888888@qq.com
地址:郑州市文化路红专路93号