一、元素分类 首先要知道元素分三种：内联元素（行内元素）、块级元素、内联块级元素。 1、内联（行内）元素 可与其他元素占一行 高、行高、内外边距不可更改 宽度为内容所占宽度，不可更改 容纳文本或其他行内元素 2、块级元素 独占一行 高、行高 ...

本文例子也以Taro代码为示例，如果你用小程序语言、uni-app等框架也不用担心，因为原理是一样的。 一、理解设计原理 问题的关键在于“如何判断第一次打开”，有两种方法： 1、打开页面后本地存一个flag到session； 2、和服务器交 ...

文章首发于公众号【大数据学徒】，感兴趣请搜索 dashujuxuetu 或者文末扫码关注。 我正在用 Jetty 开发自己的一个玩具项目，在这个项目中，涉及到使用 WebSocket 在前后端之间交换 JSON 数据，本文对此做一个总结。 ...

效果 鼠标触碰按钮，出现水墨风格动画 屏幕自适应 一份html文件，一份css文件，无javascript，上手程度：很简单 笔记 :root 这个 CSS 伪类匹配文档树的根元素。对于 HTML 来说，:root 表示元素，除了优先级更 ...

Flexbox是一个CSS3的盒子模型（box model），顾名思义它就是一个灵活的盒子（Flexible Box）。 Flexbox模型概念 第一步要来看Flexbox的盒子模型，根据W3C文章所描述，flex的盒子模型如下图所呈现，与 ...

Flex的基本概念 Flex是Flexible Box的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。 任何一个容器都可以指定为Flex布局。 .box{ display:flex; } 行内样式也可以使用Flex布局 .box{ ...

CSS自定义属性的工作方式有点像SASS和其他预处理器中的变量，主要的区别在于其它方法都是在浏览器中编译后生成，还是原本的CSS写法。CSS自定义属性是真正的动态变量，可以在样式表中或使用javascript即时更新，这使得它们具有更多的可 ...

我的博客地址 正式地址 测试地址 前端源码 后端源码 文章目录 项目及其技术栈介绍 前端: 项目初始化 前端: 使用Sass和Antd 前端: 开发体验优化 前端: 搭建路由和状态管理 前端: 支持Axios 前端: 打包与环境变量设置 前 ...

之前因为客户端引入Facebook的YOGA库，以及微信小程序学习的原因，对于前端的布局有一定的了解。书读百遍其义自见，不经常使用的工具还是需要时不时学习，比如Flexbox和Position布局。 1. 流式布局 在未设置其他任何布局的情 ...

新的一周开始了，冷风吹得人懒洋洋不想动弹.趁着总结iOS新特性之前继续学习CSS布局。 Absolute 绝对布局，破坏了流结构，会直接覆盖在其他流结构布局元素上。 position:absolute; ① 未设置left right bo ...