下定决心还是再学一遍CSS等前端知识
Day08
1. border图形
-
border-right-color -
旋转
transform: rotate(90deg);transform-origin: center/25%;旋转中心点
-
https://css-tricks.com/the-shapes-of-css
2. Web网络字体
- 之前通过
font-family设置字体- 我们需要提供一个或多个字体种类名称,浏览器会在列表中搜寻,直到找到它所运行的系统上可用的字体
- 这样 的方式完全没有问题,但是对于传统的web开发人员来说,字体选择是有限的
- 这就是所谓的web-safe字体
- 并且这种默认可选的字体并不能进行一些定制化的需求
2.1 web fonts 的工作原理
-
首先,需要通过一些渠道获取到希望使用的字体
- 对于某些收费的字体,需要获取到对应的授权
- 对于某些公司定制的字体,需要设计人员来设计
- 对于某些免费的字体,需要获取到对应的字体文件
-
其次,在我们的CSS代码当中使用该字体(重要)
- 具体看后面的操作流程
-
最后,在部署静态资源的时候,将HTML/CSS/JavaScript/Font一起部署在静态服务器中
-
用户的角度
- 浏览一个网页的时候,因为代码中有引入字体文件,字体文件会被一起下载下来
- 浏览器会根据使用的字体在下载的字体文件中查找,解析,使用对应的字体
- 在浏览器中使用对应的字体显示内容



-
流媒体
-
封装格式
-
编码格式
-
3. Web字体图标
4. CSS精灵图

spritecow.com