文章库ARTICLE COLUMN

  • absoluted定位和relative定位

    absoluted定位和relative定位

    摘要:脱离文档流首先设置绝对定位后,会脱离文档流,因此不占据空间。相对于谁定位相对于它在普通文档流中的位置。脱离文档流后可以做什么绝对定位的框与文档流无关,所以它们可以覆盖页面上的其它元素。 脱离文档流? 首先div设置absoluted绝对定位后,div...

    wangjuntytlwangjuntytl 评论0 收藏0
  • DIY audio player - 自定义audio播放器样式

    DIY audio player - 自定义audio播放器样式

    摘要:之前也有用到,大概是生日贺卡,博客音乐,播放语音等场景。哦,可能还会涉及到自动播放。资料为元素,可以初始化多个播放器样式是写在代码里的,如果有需要,可以把代码抠出来放在文件里。然后再化成自己喜欢的样子。来个,打开为移动端模式。 之前也...

    cpuprocpupro 评论0 收藏0
  • DIY video player - 自定义video播放器样式

    DIY video player - 自定义video播放器样式

    摘要:本文基于,自定义视频播放器样式。有的浏览器就是不支持,白名单都没有。来个,打开为移动端模式,的事件是支持的,只是样式需要自个儿来。 DIY 本文基于HTML5 Video API,自定义Web视频播放器样式。 其实吧,原生的video 标签样式挺好看的,但每个人...

    CarbsCarbs 评论0 收藏0
  • snippet,让你编码效率翻倍

    snippet,让你编码效率翻倍

    摘要:做个记录,上菜了如何打开配置这里以为例,其他编辑器大概也差不多。时间相关当前年份当前年份的后两位格式化为两位数字的当前月份,如当前月份的全称,如当前月份的简称,如当天月份第几天当天周几,如当天周几的简称,如当前小时小时制当前分钟当前秒...

    densondenson 评论0 收藏0
  • 前端工具【3】—— 图片处理

    前端工具【3】—— 图片处理

    摘要:切图主要是用的工具就是等等,除此之外,在开发过程中我们也会用到其他工具,以下介绍一些有关于图片处理的操作。是打开文件捕捉活动窗口捕获窗口捕获矩形区域,可自行截图。新版的比之前那些版本增加了一键导出功能,这个功能很大程度方便了我们拆分图...

    RangoRango 评论0 收藏0
  • jquery选择器 (nth-of-type() nth-child()区别内容更新)

    jquery选择器 (nth-of-type() nth-child()区别内容更新)

    摘要:它通过易于使用的在大量浏览器中运行,使得文档遍历和操作,事件处理,动画和更加简单。如果想打印输出对象的内容。他们的宽高都显示设置为一个祖先元素是隐藏的。元素被认为是可见的,因为他们仍然占据布局空间。 官网传送门: http://jquery.com/中...

    lowettlowett 评论0 收藏0
  • 前端兼容性问题总结

    前端兼容性问题总结

    摘要:篇样式兼容性问题按模式渲染按模式渲染怪异模式怪异模式是没有遵守规范的一种兼容模式,其中的是包括左右左右在内的全部范围也一样,类似于,而且的不能从父元素继承。 HTML 篇 样式兼容性问题 怪异模式 怪异模式是没有遵守 W3C 规范的一种兼容模...

    骞讳护骞讳护 评论0 收藏0
  • 前端开发中的基础思考题

    前端开发中的基础思考题

    摘要:线程的划分尺度小于进程,使得多线程程序的并发性高。线程在执行过程中与进程还是有区别的。用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。 前些日子在忙着面试,拿了心仪的 offer 以后闲下来整理了一些面试相关的基本概念。由于...

    Charlie_JadeCharlie_Jade 评论0 收藏0
  • 常见样式设计及DOM操作整理

    常见样式设计及DOM操作整理

    摘要:部分为不同链接添加不同样式跨浏览器灰度图动画背景清除浮动方法方法方法将浮动元素用一个不浮动的包裹起来表格宽度自适应任意阴影文本宽度自适应模糊文本网页加载动画 css部分 为不同链接添加不同样式 a[href^="http"]{ padding-right: 20px; backgro...

    KavenFanKavenFan 评论0 收藏0
  • 前端每日实战:131# 视频演示如何用纯 CSS 创作一把剪刀

    前端每日实战:131# 视频演示如何用纯 CSS 创作一把剪刀

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 showImg("https://segmentfault.com/img/bVbgGKo?w=400&h=299"); 效果预览 按下右侧的点击预览...

    岳光岳光 评论0 收藏0
  • 前端最受欢迎的 UI 框架

    前端最受欢迎的 UI 框架

    摘要:前端最受欢迎的框架由出品的框架。框架主要以为主,为辅,组件部分依赖。但与不同的是,它的命名采用语义化,而非连字符如。也有针对的适配。材质设计材质设计蚂蚁金服出品的一套框架另一套类似和的框架。 前端最受欢迎的 UI 框架 bootstrap: 由 twi...

    ispringispring 评论0 收藏0
  • 如果你在2018面试前端,那这篇文章最好看一看!

    如果你在2018面试前端,那这篇文章最好看一看!

    摘要:优点是继承了父类的模板,又继承了父类的原型对象,缺点就是父类实例传参,不是子类实例化传参,不符合常规语言的写法使用的方式继承了父类的模板,不继承了父类的原型对象。优点是方便了子类实例传参,缺点就是不继承了父类的原型对 github版本戳,求s...

    Guakin_HuangGuakin_Huang 评论0 收藏0
  • 2018前端面试总结

    2018前端面试总结

    转载:https://juejin.im/post/5b94d8...

    freewolffreewolf 评论0 收藏0
  • 自制简单的range(Vue)

    自制简单的range(Vue)

    摘要:废话不多说先上成果图实现思路主要分界面与逻辑两大块界面分为个部分左滑块长度左内容位置中间长度右滑块长度右内容位置逻辑个事件各滑块长度及位置计算选中时变色具体实现步骤首先我们明白整个容器的长度是不变的等于左边中间右边所以我们可以通过先获...

    sunnyxdsunnyxd 评论0 收藏0
  • 前端每日实战:132# 视频演示如何用纯 CSS 创作一只思考的手

    前端每日实战:132# 视频演示如何用纯 CSS 创作一只思考的手

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。 showImg("https://segmentfault.com/img/bVbgKsi?w=400&h=299"); 效果预览 按下右侧的点击预览...

    xiguadadaxiguadada 评论0 收藏0
  • css3 做一个类似于翻书特效的3D动画

    css3 做一个类似于翻书特效的3D动画

    摘要:我们来看下做一个动画需要哪些东西。说明各个属性的作用代表物体距离浏览器是。下面我们做一个向下翻页的数字,和一个向做翻页的数字。 我们来看下做一个css3 3D动画需要哪些东西。前面我们已经使用transition和transform做了一些简单的操作。 设置3D...

    jiekechoojiekechoo 评论0 收藏0
  • safari,IOS下iframe宽高度被内容撑出设备高度

    safari,IOS下iframe宽高度被内容撑出设备高度

    摘要:问题浏览器下的的宽高都会被内容撑大这是一个浏览器存在的缺陷,无论如何设置的宽高,都会被内容的宽高撑大,这会导致页面变得很大。 问题:safari浏览器下的iframe的宽高都会被内容撑大 这是一个safari浏览器存在的缺陷,无论如何设置iframe的宽高,...

    zerozero 评论0 收藏0
  • css自定义属性和聚光灯效果

    css自定义属性和聚光灯效果

    摘要:神秘巨星神秘巨星是谁它就是。语法语法有点难看但很简单,来声明变量名,来使用,也许你要问了,为什么使用不用一类的呢,唉,那不是两个货用了吗声明和使用必须放在代码块里代码是不是很简单,可以直接看效果,就不赘述了。 出场曲 神秘巨星来了吗?...

    SikeSike 评论0 收藏0
  • 前端每日实战:133# 视频演示如何用 CSS 和 GSAP 创作有多个关键帧的连续动画

    前端每日实战:133# 视频演示如何用 CSS 和 GSAP 创作有多个关键帧的连续动画

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。隐藏容器外的内容,并删掉辅助线最后,装饰一下页面的角落大功告成 showImg("https://segmentfault....

    forsignerforsigner 评论0 收藏0
  • css3 新特性

    css3 新特性

    摘要:在中,对于文本我们可以设置锐利犀利浑厚平滑,在中也新增了这个类型的特性,就是属性。用于小像素的文本浏览器默认的反锯齿也有兼容问题,需要带不同内核是新增的属性,指当元素不面向屏幕时是否可见。背面是不可见的。 font-smoothing 在photoshop中...

    whincwhinc 评论0 收藏0
  • Webpack4教程 - 第二部分,使用loader处理scss,图片以及转换JS

    Webpack4教程 - 第二部分,使用loader处理scss,图片以及转换JS

    摘要:它将包括如何处理图片以及对老版本的语言的转换。添加使用最好的方式是在文件中指定它们。而相反,文件被转换为了。它允许你使用转译文件。此外,我们还学习如何使用处理图片。在教程未来的部分,我们会深入到中,包括写一个我们自己的。 转载请注明出...

    JiobyJioby 评论0 收藏0
  • 前端每日实战:129# 视频演示如何用纯 CSS 和原生 JS 创作一个条纹错觉动画

    前端每日实战:129# 视频演示如何用纯 CSS 和原生 JS 创作一个条纹错觉动画

    摘要:效果预览按下右侧的点击预览按钮可以在当前页面预览,点击链接可以全屏预览。可交互视频此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。接下来我们来揭秘真相。 showImg("https://segmentfault.com/img/bVbgztX?w=400&h=293"); 效果预览 ...

    alexnevskyalexnevsky 评论0 收藏0
  • css实战#用css画一个中国结

    css实战#用css画一个中国结

    大家好!今天跟大家分享一个用 css 画中国结的教程。最终效果如下: showImg("https://segmentfault.com/img/bVbgz00?w=396&h=320"); 大家如果感兴趣可以参考我的源码:gitHub地址 首先,我们定义好画中国结需要的结构: 然后开始写...

    Yi_Zhi_YuYi_Zhi_Yu 评论0 收藏0
  • css 垂直居中方法汇总

    css 垂直居中方法汇总

    摘要:优点写法简单,适应性好缺点兼容性一般,不支持浏览器小节以上共有种方式来实现垂直居中的效果,个人是最青睐第种方式的,兼容性好,适应性好,各位小伙伴还有没有其他的实现方式呢 查看原文可以有更好的排版效果哦 前言 居中是平时工作中的最常见的一...

    CarterLiCarterLi 评论0 收藏0
  • React Autocomplete(自动完成输入)示例教程

    React Autocomplete(自动完成输入)示例教程

    摘要:示例教程是今天的主题。样式将包含,,,它们是左上角的坐标和下拉菜单的宽度。这是函数,并为项目中的每个条目调用,它还传递以生成下拉菜单中每个项目的渲染树。样式是一组可选样式,可用于改善下拉菜单中项目的外观。所以,最后,我们已经完成了示例...

    woshicixidewoshicixide 评论0 收藏0

热门文章

<