*css - 随笔分类 - 一名小学生呀

浏览器滚动条设置

摘要：webkit主要有下面7个设置属性： ::-webkit-scrollbar 滚动条整体，可以设置宽度等 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollbar-track 外层轨道 ::-webkit-scrollbar-track-piec 阅读全文

posted @ 2024-03-12 17:54 一名小学生呀阅读(370) 评论(0) 推荐(0)

动画和过渡

摘要：先举个例子，动画--实现上下无限跳动 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0 阅读全文

posted @ 2022-08-11 11:22 一名小学生呀阅读(157) 评论(0) 推荐(0)

px和rem的换算关系

摘要：rem 是相对于根元素<html>，需要在根元素确定一个参考值，这个参考值设置为多少，可根据自己的需求定义。浏览器默认字号16px | px | rem | | 12 | 12/16 = .75 | | 14 | 14/16 = .875 | | 16 | 16/16 = 1 | | 18 | 1 阅读全文

posted @ 2022-08-11 09:30 一名小学生呀阅读(4214) 评论(0) 推荐(0)

css 视口设置自适应铺满整屏

摘要：视口单位(Viewport units) 什么是视口？在桌面端，视口指的是在桌面端，指的是浏览器的可视区域；而在移动端，它涉及3个视口：Layout Viewport(布局视口)，Visual Viewport(视觉视口)，Ideal Viewport(理想视口) 视口单位中的“视口”，桌面端指阅读全文

posted @ 2022-02-03 21:48 一名小学生呀阅读(926) 评论(0) 推荐(0)

CSS不换行与CSS换行

摘要：1. 使用强制换行符号 <br/> 2. 使用<div><p>等行标签 3. 使用css属性中word-wrap属性 word-wrap: normal|break-word; normal表示只在允许的断字点换行（浏览器保持默认处理）。 break-word表示在长单词或 URL 地址内部进行换行阅读全文

posted @ 2021-11-26 14:46 一名小学生呀阅读(407) 评论(0) 推荐(0)

flex布局---弹性盒子的设置

摘要：布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。采用 Flex 布局的元素，任何一个容器都可以指定为 Flex 布局： 1.容器默认存在两根轴：横轴和纵轴 2.采用flex布局的元阅读全文

posted @ 2021-07-12 14:27 一名小学生呀阅读(227) 评论(0) 推荐(0)

随笔分类 - *css