关于Web的学习(18.5.27)——css篇

1.让页面里的字体变清晰,变细用CSS怎么做?

-webkit-font-smoothing在window系统下没有起作用,但是在IOS设备上起作用;

-webkit-font-smoothing:antialiased是最佳的,灰度平滑。

附:效果展示


2.font-style属性可以让它赋值为“oblique”,oblique是什么意思?

在css规范中这么描述的,让一种字体表示为斜体(oblique),如果没有这样样式,就可以使用italic。

oblique是一种倾斜的文字,不是斜体。


3.position:fixed;在android下无效怎么处理?

fixed的元素是相对整个页面固定位置的,你在屏幕上滑动只是在移动这个所谓的viewport,原来的网页还好好的在那,fixed的内容也没有变过位置,所以说并不是iOS不支持fixed,只是fixed的元素不是相对手机屏幕固定的。

在head头中加入

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>


4.如果需要手动写动画,你认为最小时间间隔是多久,为什么?

多数显示器默认频率是60Hz,即1秒刷新60次,所以理论上最小间隔为1/60*1000ms=16.7ms。


5.display:inline-block 什么时候会显示间隙?

  • 有空格时候会有间隙。解决:移除空格
  • margin正值的时候。解决:margin使用负值
  • 使用font-size时候。解决:使用font-size:0、letter-spacing、word-spacing


6.overflow: scroll时不能平滑滚动的问题怎么处理?

  • 高度尺寸不确定的时候,使用:overflow-y:scroll;
  • 高度尺寸确定的,要么没有滚动条,要么直接出现,不会出现跳动。
  • css3计算calc和vw单位巧妙实现滚动条出现页面不跳动:
.wrap-outer {
    margin-left: calc(100vw - 100%);
}

    或者

.wrap-outer {
    padding-left: calc(100vw - 100%);
}

首先,.wrap-outer指的是居中定宽主体的父级,如果没有,创建一个

然后,calc是css3的计算

100vw是浏览器的内部宽度,而100%是可用宽度,不含滚动条

calc(100vw-100%)是浏览器的滚动条的宽度

猜你喜欢

转载自blog.csdn.net/qq_36048820/article/details/80471499