![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端踩坑蹚水小妹
文章平均质量分 64
fairycode
这个作者很懒,什么都没留下…
展开
-
nth-child(x)与nth-of-type(x)用法
近期在复习前端,现在html css进行到form表单 即将进入js阶段:)码码后想达到的效果大概如此input text radio select textarea等在html内给几个小标题用了同样的class <form action=""> <div class="title">姓名</div> <input type="text" > <div class="title">昵称</div&原创 2021-03-15 16:47:48 · 289 阅读 · 1 评论 -
Bezier贝塞尔曲线探索(个人站)
最近在做个人站,因为其实较码码来说,平时还是规划和设计类的职能更多一些就考虑做一个展示型的站点,顺便也检查下自己的学习成果主页的视觉这效果大致如下其实总体来说布局是较为清晰的,四角+中间中间分为左+右+下早起的难点其实是下部那条曲线,感谢@我教你跳伞咯帮忙(为了方便其实已经修改过设计稿,原本绘制的锚点方向不统一,导致标准点坐标特别难计算)变动如下没修改的时候整体比较平滑圆润,但锚点杂乱(其实修改的更精细点也可以,但我比较糙汉)修改后保留了整体的走向,使锚点方向统一可控因为贝塞尔曲线原创 2021-03-05 15:29:57 · 2086 阅读 · 5 评论 -
Flex布局知识点总结
//任何一个容器都可以指定为Flex 布局。.box{ display:flex;}//内元素也可以使用Flex布局。.box{ display:inline-flex;}//webkit内核的浏览器,必需加上-webkit前缀.box{ display:-webkit-flex; display:flex;}弹性容器:给元素添加display:flex后就是弹性容器。弹性属性:弹性容器中的所有子元素称为<弹性元素>,弹性元素永远沿主轴排转载 2020-11-16 17:16:22 · 165 阅读 · 0 评论 -
web前端踩坑小妹 简书文章页布局练习(flex练习)
近期在重拾页面~做一个简书文章页的布局练习~截至11-12晚进度代码量html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title> 简书文章页 </title> <!-- 外链css --> <link rel="stylesheet" href="janeys.原创 2020-11-13 09:29:34 · 182 阅读 · 0 评论 -
记遇到的问题(本问题已解决)
目前另一款小程序开发基本完成在真机调试的过程中发现原本应该兼容性较强的小程序在不同系统/不同版本上运行效果差距非常大小米的几款机型都会导致遮罩层的实际优先级不正确的情况具体表现如下:希望的优先级从高到低排列顶部控件区弹窗遮罩层底部内容但是实际的优先级视觉上和上面一致(显示正常)但是底部内容可以点击,如input,btn等可以跳出遮罩触发事件心累 目前只能一个个页面去关事件 其他系统和品牌机型表现正常...原创 2020-11-03 09:17:46 · 103 阅读 · 0 评论 -
web前端踩坑小妹border-radius
在涉及到矩形(div bg)的圆角设置的时候尝试了px和%但是一直达不到效果。一直以为radius是4个值,结果是8个,分别对应top-left/right,right-top/bottom,bottom-right/left,left-bottom/top。数值和百分比都可以,可以通用也可以单独定义,大概如下。markborder-radius-top-left:20px;border-radius-left-top:20px;border-redius-left-bottom:50%;bo原创 2020-10-30 09:28:50 · 227 阅读 · 0 评论