摘要: Flex弹性布局 开启弹性 父容器设置:display: flex; 容器分为:主轴、侧轴(交叉轴) 默认主轴水平向右,侧轴垂直向下。 父容器常用属性 flex-direction 主轴方向 row水平、column垂直、reverse反向 justify-content 主轴对齐 flex-sta 阅读全文
posted @ 2026-07-10 12:27 于凯 阅读(6) 评论(0) 推荐(0)
摘要: 一、布局基础前提:标准文档流 浏览器默认排版规则 • 块级元素:独占整行,自上而下垂直排列,可设置宽高 • 行内/行内块元素:在一行从左往右排布,空间不足自动换行 脱离标准流三种方式:浮动、绝对定位、固定定位 二、传统布局方案 浮动布局 float 属性值 left左浮、right右浮、none不浮 阅读全文
posted @ 2026-07-10 12:25 于凯 阅读(5) 评论(0) 推荐(0)
摘要: input通用重要属性 • placeholder:输入框灰色提示文字 • disabled:禁用控件,无法输入且不会提交数据 • readonly:只读,可以选中复制,数据能正常提交 • checked:单选/复选默认选中 • max/min/maxlength:数值范围、最大字符长度 • aut 阅读全文
posted @ 2026-07-07 19:58 于凯 阅读(8) 评论(0) 推荐(0)
摘要: 表单()用于收集用户输入数据,提交给后端服务器,是前后端数据交互最常用载体。 action:表单数据提交地址,不写默认提交到当前页面 method GET:数据拼在URL上,容量小、明文显示,适合查询 POST:数据放在请求体,相对安全,适合提交隐私、大量数据 常用type类型 • text:单行文 阅读全文
posted @ 2026-07-07 19:57 于凯 阅读(4) 评论(0) 推荐(0)
摘要: 盒子组成 content内容区、padding内边距、border边框、margin外边距 外边距塌陷:垂直方向相邻块元素margin会合并取最大值。 浮动布局 float 取值:left / right / none 特点: • 元素脱离标准流,横向并排; • 高度塌陷:父盒子没有高度,被子元素撑 阅读全文
posted @ 2026-07-07 19:55 于凯 阅读(5) 评论(0) 推荐(0)
摘要: 常用样式 字体、颜色、背景、边框圆角、阴影、透明度opacity 数据类型 基本类型:String、Number、Boolean、Null、Undefined、Symbol、BigInt 引用类型:Object、Array、Function 变量声明 var(函数作用域)、let(块级)、const 阅读全文
posted @ 2026-07-07 19:51 于凯 阅读(7) 评论(0) 推荐(0)
摘要: 1.垂直居中:单行文本垂直居中(行高方法)、单行多行固定高度文本垂直居中(flex方法)、单行多行适用不固定高度(padding方法) 因为子级浮动导致父级高度塌陷,解决方法:将父级设置为overflow:hidden; 阅读全文
posted @ 2026-07-07 19:48 于凯 阅读(6) 评论(0) 推荐(0)
摘要: 它可能取5个值 具体的对齐方式与交叉轴的方向有关,下面假设交叉轴从上到下。flex-start:交叉轴的起点对齐。 flex-end:交叉轴的终点对齐。 center:交叉轴的中点对齐。 baseline: 项目的第一行文字的基线对齐。 stretch (默认值):如果项目未设置高度或设为auto, 阅读全文
posted @ 2026-07-07 19:46 于凯 阅读(4) 评论(0) 推荐(0)
摘要: css定位布局分别是:标准流,浮动和定位 position属性值为:relative,absolute,fixed top,right,left,bottom 定位 relative:相对定位 absolute:绝对定位 fixed:固定定位 阅读全文
posted @ 2026-05-27 08:11 于凯 阅读(7) 评论(0) 推荐(0)
摘要: 一,布局的原则 先分大块,再分小块;先横在竖 二,几个1→n的问题 1.文本折叠 (1)单行折叠 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; (2)多行折叠 display:-webkit-box; -webkit- 阅读全文
posted @ 2026-05-20 08:00 于凯 阅读(11) 评论(0) 推荐(0)