唯品秀博客

利用flex布局超简单实现瀑布流排版

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

瀑布流布局基本大家都见过，绝大多数是用于图片上。其实以前想做瀑布流还是不容易的，因为需要去定位，动态计算每张图片位置，于是就很多人做了类似的jq插件，但css3出来后，想做瀑布流那就是小儿科了，直接上案...

阅读全文

2019年05月11日 248℃ 2条评论 0喜欢

利用css3进行表单验证并且配带结果提示

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

通过css3我们也可以进行验证表单非法字符，并且还能给出提示语 1234567891011  <form class="form" id="form" method="get" action="/api/form">   &nb...

阅读全文

2019年04月12日 275℃ 0条评论 4喜欢

移动端rem小于12px文字-webkit-text-size-adjust

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

昨天做项目，遇到一个神奇的css问题，也是我做前端为止遇到的最花我时间的一个问题，整整找了一下午这个bug，先说说问题。大家在做移动端开发H5页面时候，设计图通常是750px宽，然后通过rem转换我们在苹果6尺寸下...

阅读全文

2019年01月24日 1125℃ 4条评论 2喜欢

【mac safari浏览器】设置border-radius但overflow:hidden失效问题

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

正常来讲，如果我们设置父亲元素圆角，并且设置超出部分隐藏，那么子元素也应该限制在这个父亲带有圆角的区域内，但事与愿违，如下图： 在之前帮别人做的一个案例中也有同样的问题，因为子元素设置了transform旋...

阅读全文

2019年01月19日 1174℃ 1条评论 3喜欢

css3弹性盒子display:flex常见属性总结

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

一：display:flex 布局 display:flex 是一种布局方式。它即可以应用于容器中，也可以应用于行内元素。是W3C提出的一种新的方案，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持...

阅读全文

2019年01月18日 1111℃ 0条评论 3喜欢

使用css3绘制任意角度扇形

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

核心技术两点，一、旋转rotate，二、倾斜skewY，直接上代码： 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374...

阅读全文

2019年01月16日 1206℃ 1条评论 4喜欢

CSS3神奇的css高亮 – filter(滤镜)

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

效果展示 现在请用鼠标轻轻抚摸下咱们景甜小姐姐的小胸脯，初看到这个效果，是否想到的是改变两张图片的透明度，查看之后发现是用filter实现的，很简洁有没有。实现方式、隐藏显示，也可以用图片定位，但是挺麻烦...

阅读全文

2018年11月15日 2095℃ 0条评论 4喜欢

前端针对某个特殊浏览器做兼容（Hack）

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

此处的“hack”并非是网络中很神秘的组织“黑客”，而是使用他们可以帮助你解决浏览器下一些怪异和特殊的bug。很多时候对于这样的讨论也非常多，比如说在您的代码中应不应该使用hack？甚至延伸到使用“hack”是一个优秀...

阅读全文

2018年11月13日 1256℃ 0条评论 1喜欢

深入了解line-height文字垂直居中

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

先思考下面这个问题：默认空div高度是 0，但是一旦里面写上几个文字，div高度就有了，请问这个高度由何而来，或者说是由哪个 CSS 属性决定的？ 如果仅仅通过表象来确认，估计不少人会认为div高度是由里面的文字撑...

阅读全文

2018年09月29日 1350℃ 0条评论 3喜欢

使用less自动进行移动端rem适配计算

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

在做移动端的时候，最主要的问题就是要做适配，通过我们都是通过rem，但是，rem和px需要我们去转换，在一个项目中前端尺寸每次都需要计算的时候，那就应该交给插件工具们，当然，如果你的项目是工程化的例如vue-c...

阅读全文

2018年08月17日 2544℃ 0条评论 5喜欢

页面不满一屏footer固定在底部

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

很多时候比如登录和注册页面，又或者是列表页面数据很少的情况下，我们是不希望底部footer跑到屏幕上方去的，而是希望固定在底部，但是当内容足够一屏幕时候，底部继续随着信息流往下走，当前案例代码由QQ群：610...

阅读全文

2018年07月20日 2071℃ 0条评论 10喜欢

双击视频/图片全屏功能（解决全屏后双击无法退出）

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

首先：实现全屏功能并不麻烦，两个api就能搞定，全屏：element.requestFullscreen();退出全屏：document.exitFullscreen();但实际运用中发现，全屏后是无法再双击退出全屏，本文重点就是解决这个问题，直接上代码...

阅读全文

2018年04月22日 2504℃ 0条评论 3喜欢

CSS3中伪类的content和attr的用法

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

说起css的content，很多人都知道那就是用来在标签头尾插入内容的，但如果你说css里面的attr和content有啥关系，我想还是蛮多人不知道的吧，attr做前端的应该见名思义是用来操作html属性的，确实，在这里我们依然...

阅读全文

2018年01月30日 2696℃ 0条评论 7喜欢

HTML5摇一摇，如何判断设备摇动 – H5陀螺仪

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

好奇宝宝花点时间看了看这玩意儿，感觉还蛮好玩的样子，实际用处似乎不大，不过如果你是经常做移动端活动页面，那很可能用得上哦，不多说，直接贴代码和demo，有案例 123456789101112131415161718192021222324252...

阅读全文

2018年01月30日 4224℃ 0条评论 7喜欢

在 iOS Safari中假装自动播放 HTML5 audio(音乐) 的正确方式

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

做过移动端音乐播放器的同学可能都会发现，在安卓上页面刷新后可以做到自动播放的播放器在苹果手机上就不行，其实这是因为苹果系统的机制限制，那么我们应该怎么解决呢？核心原理: 通过一个用户交互事件来主动 pl...

阅读全文

2018年01月28日 6393℃ 0条评论 3喜欢

【YQN】CSS \ Less \ Sass 编码规范

唯品秀 • 前端开发资讯 • 唯品秀前端技术博客

1 引言 1.1 说明 本文档以 Airbnb CSS Style Guide 为基础，编写符合自己团队的编码规范；统一了命名和注释两大痛点，就统一了80%的风格，所以我们重点拓展这两部分内容，主体部分请参考基础。 1.2 基础 CSS 中...

阅读全文

2017年10月13日 1603℃ 0条评论 5喜欢

123下一页共3页

博客简介

唯品秀博客: weipxiu.com，一个关注Web前端开发技术、关注用户体验、坚持更多原创实战教程的个人网站，愿景：成为宇宙中最具有代表性的前端博客，期待您的参与 

最近更新

随机文章

文章分类

H5/CSS3 (39) Js基础 (39) jQuery (39) Js框架 (37) Node.js (7) 前端技巧 ((25)) 前端资源 (37) 前端工具 (16) CMS系统 (16) 本站公告 阿里CDN CDN大全 博主Github 百度统计 百度收录 关键词排名 经典Css片段 时间戳格式化 全国黑企名单 武汉黑企名单 996.ICU火了 Js33个概念 vConsole DSBridge DOM元素进屏 Shareinstall Http接口测试

精彩评论

友情链接

他们同样是一群网虫，却不是每天泡在网上游走在淘宝和网游之间、刷着本来就快要透支的信用卡。他们或许没有踏出国门一步，但同学却不局限在一国一校，而是遍及全球！

站点统计

  • 文章总数： 191 篇
  • 草稿数目： 2 篇
  • 分类数目： 13 个
  • 页面总数： 21 个
  • 评论总数： 830 条
  • 链接总数： 13 个
  • 标签总数： 372 个
  • 建站时间： 887 天
  • 注册用户： 718 人
  • 访问总量： 8657452 次
  • 最近更新： 2019年5月20日
服务热线：
 173xxxx7240

 QQ在线交流

点击这里给我发消息
点击这里给我发消息

 旺旺在线

点击这里给我发消息
点击这里给我发消息