测试题

只适合对于基础不熟悉的人：w3schools

外部CSS在HTML导入

1
<link rel="stylesheet" href="mystyle.css">

link 标签是 HTML 中的一个元素，用于在文档中引入外部资源。rel 属性是relation的缩写，用于定义引用资源与当前文档之间的关系。rel=”stylesheet” 表示这个链接指向的是一个样式表文件，用于控制当前文档的样式。

一种奇怪且有用的配色思路：混合

通过设定rgba的透明度，使得相同颜色的不同深浅混合在一起实现颜色搭配

CSS间距过大

line-height设置了大于1，此时行高度为line-height倍数的字体高度，比如继承了body的line-height：1.6

li设置同行：只需要设置float:left或者inline-block，错在li选择器写成了.li导致没有应用style

body和header

在app.vue和组件vue文件中不应该使用header和body，因为通常app挂在body里，已经有body和header两个元素了。

关于 自动更新页面，涉及RouterView级别的样式和元素template重构需要手动重新渲染。

  • display:static,即默认情况下, top, bottom, left, 和 right 不生效

vue通常需要main.css，并在其中指定app占满全屏页面，如

1
2
3
4
5
6
7
8
/* /assets/main.css */
html,
body,
#app{
  height: 100%;
  margin: 0;
  padding: 0;
}

同时在main中使用

1
2
/* main.ts 或 main.js */
import './assets/main.css'

CSS选择器

1
2
3
4
5
6
/* 伪类选择器 */
.xx-class{

}

/* ...  */

逗号’,’表示多个选择器共用CSS，而空格’ ‘表示后代选择器。例如，如果你想要选择<div>元素内的所有<p>元素，并给它们设置相同的样式，你可以使用以下CSS规则：

1
2
3
div p {
  color: blue;
}

所有位于<div>元素内的<p>元素会被选择