- 博客(18)
- 收藏
- 关注
原创 Flex布局(2)
* 项目的排序:值越小越靠前,默认值0,取整数(可以为负数) */n:单独给某个项目设置为n,则这个项目放大的比例是其他的n倍。0:设置为0的项目不缩小,其他等比例缩小。0:默认值,存在剩余空间时也不放大。1:所有盒子设为1则等分剩余空间。/* 缩小比例:空间不足时。1:默认值,即等比例缩小。
2025-06-19 09:48:44
388
原创 Flex布局
5.space-around:拉手对齐,环绕对齐 */4.column-reverse:从下往上 */1.flex-start:沿交叉轴的开始位置对齐。1.flex-start:沿交叉轴的开始位置对齐。1.flex-start:沿主轴的开始位置对其。2.flex-end:沿交叉轴的结束位置对齐。2.flex-end:沿交叉轴的结束位置对齐。2.flex-end:沿主轴的结束位置对其。3.center:交叉轴上居中对齐 *//* 子项目在交叉轴上的对齐方式。
2025-06-12 10:03:39
279
原创 旋转的盒子
后</div><div class="box3">左</div><div class="box4">右</div><div class="box5">上</div><div class="box6">下
2025-06-10 15:35:24
365
原创 3D代码
* 3D旋转:1表示有旋转,0表示没有旋转 *//* 透视,视距:值越大成像越小 *//* 沿X轴旋转45度 *//* 开启3D空间效果 */
2025-06-10 15:34:47
205
原创 动画代码
animation:动画名称 动画时间 次数(infinite无限的);from{ /* 动画开始的状态 */to{ /* 动画结束的状态 *//* 1.创建关键帧 */
2025-06-05 10:01:58
304
原创 转换笔记
1.位移:translate(x,y)位移,translatex():x轴位移,translateY()y轴位移,/* 元素转换的中心点: px,%,方向词(left/right/top/bottom/center) */2.缩放:scale(倍数n),scalex(倍数),scaley(倍数)4.旋转:rotate(deg),rotatex(),rotatey()/* 多个转换同时进行:位移同时旋转,一般把位移写在第一个 */n>1(放大),0<n<1(缩小)3.倾斜:skew(度deg)
2025-05-22 10:10:22
349
原创 过渡笔记
过渡的时间曲线:ease(默认值,慢-快-慢) linear(匀速)/* 过度的复合写法:过渡属性 过渡花费的时间 过渡时间曲线 延迟时间;all:全部,所有的*//* 伪类:鼠标悬停 */
2025-05-22 09:06:09
157
原创 音频与视频
source src="img/黄霄雲-星辰大海.ogg" type="audio/ogg" /><source src="img/黄霄雲-星辰大海.mp3" type="audio/mp3" />source:音频源;src:属性指向音频地址;type:指定音频格式。-- audio:插入音频。-- video:插入视频。controls:控制台。controls:控制台。
2025-05-15 09:45:40
156
原创 相对定位,绝对定位
* 绝对定位:参照有定位的祖先元素,如果祖先元素都没有定位,则参考body进行偏移 *//* 固定定位:固定在窗口的某一个位置,偏移参考的是窗口 *//* 相对定位:参考元素原先的位置进行偏移 *//* 绝对定位的盒子会脱离标准流!-- 定位:实现元素的精准定位,包含定位模式和边偏移。边偏移:top,bottom,left,right -->/* 定位的应用:大相小绝/子绝父相 */定位模式:相对定位,绝对定位,固定定位。
2025-05-05 12:41:06
283
原创 外边距会出现的问题和解决方法
* 超出部分:影藏;解决外边距塌陷问题 *//* margin-top: 50px;*/ /* 解决合并问题 *//* 相邻盒子垂直方向外边距合并问题:只需要给其中一个盒子设置外边距 */解决方法2:给父盒子添加padding(但会把盒子撑大),不推荐使用。解决方法3:给父盒子添加overflow:hidden。解决方法1:给父盒子设置边框。
2025-04-10 10:10:57
454
原创 盒子外边距
* background背景颜色 */margin: 100px auto;/* auto自动的 *//* 块级盒子水平居中:设置左右外边距为auto */*{ /* 通配符选择器:选择当前页面中所有的标签 *//* 外边距margin:盒子与盒子的距离 *//* 初始化所有标签的内,外边距 */
2025-04-10 10:09:26
297
原创 盒子模型
* 边框复合样式写法 border: 边框颜色 边框粗细 边框样式(solid实线,dashed虚线,dotted点线,);/* 顺时针:上 右 下 左 */padding: 10px 20px 30px;/* 上 左右 下 */padding: 10px 20px;/* 上下 左右 *//* top上 bottom下 left左 right右 *//* 标准的盒子模型来说,内边距会撑大盒子 *//* 复合写法 */
2025-04-03 10:06:00
321
原创 课堂学习的
我爱吃饭!<input type="radio"name="sf"/><span>职场人</span><input type="radio"name="sf"/><span>学生</span><span>密码:</span><input type="password"/><span>用户名:</span><input type="text"/><span>留言:
2025-03-20 10:10:18
402
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅