css 3 变大变小 |vue怎么解决css不冲突

/* 控制字体大小 */
body {
font-size: 16px;
}
h1 {
font-size: 48px;
}
h2 {
font-size: 36px;
}
p {
font-size: 16px;
}
/* 改变字体大小 */
/* 点击按钮，字体变大 */
.btn-enlarge {
font-size: 20px;
}
/* 点击按钮，字体变小 */
.btn-reduce {
font-size: 12px;
}

上面的代码中，大家首先设置了 body、h1、h2 和 p 元素的默认字体大小。接着，大家为网页的字体大小增加了两个按钮，通过点击按钮来控制字体的大小。

点击“变大”按钮时，大家通过为按钮添加 .btn-enlarge 样式，将字体的大小设置为 20px。相反，点击“变小”按钮时，大家为按钮添加 .btn-reduce 样式，并将字体的大小设置为 12px。

总的来说，使用 CSS 3 可以轻松地控制网页中各元素的字体大小，使网页的内容更加易读、美观。