文章库ARTICLE COLUMN

  • 前端每日实战:39# 视频演示如何用纯 CSS 创作一个表达怀念童年心情的条纹彩虹心特效

    前端每日实战:39# 视频演示如何用纯 CSS 创作一个表达怀念童年心情的条纹彩虹心特效

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

    陆斌陆斌 评论0 收藏0
  • 前端学习记录(CSS篇)

    前端学习记录(CSS篇)

    摘要:,层叠样式表,将网页内容和显示样式分离,提高程序性能。它是一种专门描述结构文档的表现方式的文档,主要用于网页风格设计,包括字体大小颜色以及元素的精确定位。用于控制与之间的距离。 CSS Cascading Style Sheet,层叠样式表,将网页内容和显示...

    skinnerskinner 评论0 收藏0
  • react使用踩坑记(一)

    react使用踩坑记(一)

    摘要:本文主要介绍在移动端项目中如何使用及其配置使用脚手架生成的项目,后运行弹出配置项,该命令不可逆哦。使用了作为计算依据,因此需要在中贴上以下代码,并没有使用淘宝的方案使用的设计图是的哦配置的按需加载当然了,你需要先。 本文主要介绍在reac...

    toddmarktoddmark 评论0 收藏0
  • 【CSS练习】IT修真院--练习2-开发工具

    【CSS练习】IT修真院--练习2-开发工具

    摘要:任务二认识开发工具今天完成的事情编辑器对比版本管理工具学习基本操作代码托管平台对比服务器使用学习明天计划的事情分析任务三完成规划及部分开发遇到的问题暂无收获编辑器对比参考三者比较,各有哪些优势和弱势一款成熟的,对网站开发者友好,插件齐...

    _ang_ang 评论0 收藏0
  • CSS浮动的特性

    CSS浮动的特性

    摘要:原因是因为没有预先设置高度,所以高度由其包含的子元素高度决定。而浮动脱离文档流,所以子元素并不会被计算高度。此时的中,相当于中子元素高度为,所以发生了父元素高度塌陷现象。因为凡是能创建一个,就能达到包裹浮动子元素的效果。 浮动具有以下...

    yuxueyuxue 评论0 收藏0
  • 前端每日实战:35# 视频演示如何把 CSS 径向渐变用得出神入化,只用一个 DOM 元素就能画出国

    前端每日实战:35# 视频演示如何把 CSS 径向渐变用得出神入化,只用一个 DOM 元素就能画出国

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

    ssshooterssshooter 评论0 收藏0
  • flex布局滚动问题,子元素无法全部显示的解决办法

    flex布局滚动问题,子元素无法全部显示的解决办法

    摘要:布局使用起来非常方便,对于水平垂直居中的需求,很容易就能实现。但是前不久,在做全屏弹窗遮罩登录的时候,遇到了布局滚动的一个问题,在此记录一下。关键就在于最低高度,如果不用最低高度的话,滚动时还是无法全部显示登录框。 flex布局使用起来非...

    ScliangScliang 评论0 收藏0
  • Codepen 每周精选:本周最值得推荐的 23 个页面特效(2018-5-28)

    Codepen 每周精选:本周最值得推荐的 23 个页面特效(2018-5-28)

    摘要:按下右侧的点击预览按钮可以在当前页面预览,点击链接可以打开原始页面。 按下右侧的点击预览按钮可以在当前页面预览,点击链接可以打开原始页面。 1. 随机生成的有流向的粒子效果https://codepen.io/ge1doot/pe... 2. 用 jquery 写的变换动画http...

    caohaoyucaohaoyu 评论0 收藏0
  • CSS2-盒模型、背景图片

    CSS2-盒模型、背景图片

    摘要:合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。雪碧图的使用背景图与元素的原点重合。白色框是元素,绿色框是背景图片。 盒模型属性 margin外边距(top,right,bottom,left)border边框(top,right,bottom,left)padding内边距(top,rig...

    yuanzhanghuyuanzhanghu 评论0 收藏0
  • 愈发熟练的 CSS 技巧

    愈发熟练的 CSS 技巧

    摘要:适配方案简单解析相对于根元素的的大小来计算坐作为一个单位是根据手淘团队,比较,改写的一个插件,兼容竖屏转横屏出现的,自定义视觉设计稿的宽度,设定最大宽度这里有的地址,下载下来用即可第一个参数是视觉设计稿的宽度,一般视觉设计稿有,可 sh...

    Lin_YTLin_YT 评论0 收藏0
  • CSS3中display属性的Flex布局-圣杯布局实例

    CSS3中display属性的Flex布局-圣杯布局实例

    摘要:负值对该属性无效。我们通常用到的就是这个属性,在布局的时候会很有用。对于这个属性,最好是手动敲一下,尝试一下各种值出现的效果。三圣杯布局布局一直是很重要的知识点,在面试中也会经常遇到,这里就用做一个圣杯布局。 一,为什么写这篇文章 在...

    pineconepinecone 评论0 收藏0
  • 前端每日实战:36# 视频演示如何利用 CSS 动画原理,在页面上表现日蚀现象

    前端每日实战:36# 视频演示如何利用 CSS 动画原理,在页面上表现日蚀现象

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

    张巨伟张巨伟 评论0 收藏0
  • CSS 3-浮动、定位

    CSS 3-浮动、定位

    摘要:让元素脱离文档流有三种方法浮动绝对定位固定定位元素脱离文档流定位的三种布局机制文档流浮动定位。定位元素会脱离文档流。浮动的元素是先站住自己所在文档流的位置,然后左右浮动。 文档流 文档流是一种默认定位方式,在文档流中元素框的位置由元素...

    TalkingDataTalkingData 评论0 收藏0
  • 如何找到所有 HTML select 标签的选中项

    如何找到所有 HTML select 标签的选中项

    话不多说,咱就直奔主题吧,直接展示代码: 1 2 3 4 5 1 2 3 4 5 以下就是js的部分: JQ: 获取所有选中的项(获取所有的select的选中项...

    lastSerieslastSeries 评论0 收藏0
  • laravel框架学习之路(三)Laravel Datatables的使用

    laravel框架学习之路(三)Laravel Datatables的使用

    摘要:我们知道,做后台管理系统需要很多表格用来展示我们的数据,笔者在项目中使用过,对于快速开发来说,将是一个不错的选择。 我们知道,做后台管理系统需要很多表格用来展示我们的数据,笔者在tp项目中使用过datatables,对于快速开发来说,datatables将...

    Lin_YTLin_YT 评论0 收藏0
  • Vue组件-极简的地址选择器

    Vue组件-极简的地址选择器

    摘要:一前言本文用完成一个极简的地点选择器,我们接下来带大家实现这个。当然其中也有一些值得学习与注意的地方。但是这其实也有无法监控的数据。 一、前言 本文用Vue完成一个极简的地点选择器,我们接下来带大家实现这个。当然其中也有一些值得学习与注意...

    blastzblastz 评论0 收藏0
  • Flutter样式和布局控件简析(二)

    Flutter样式和布局控件简析(二)

    摘要:开始继续接着分析相关的样式和布局控件,但是这次内容难度感觉比较高,怕有分析不到位的地方,所以这次仅仅当做一个参考,大家最好可以自己阅读一下代码,应该会有更深的体会。关于属性,指前一个组件的布局区域和绘制区域重叠了。 开始 继续接着分析F...

    yckyck 评论0 收藏0
  • 前端每日实战:37# 视频演示如何把握好 transition 和 animation 的时序,创作

    前端每日实战:37# 视频演示如何把握好 transition 和 animation 的时序,创作

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

    forsignerforsigner 评论0 收藏0
  • 水平居中、垂直居中、水平垂直居中、浮动居中、绝对定位居中.......帮你搞定

    水平居中、垂直居中、水平垂直居中、浮动居中、绝对定位居中.......帮你搞定

    摘要:包括水平居中,垂直居中,还有水平垂直居中。如果要再要细分,还要分浮动元素绝对定位的居中。样式水平居中的元素图片的水平居中图片的居中,比较特殊。 2018.05.29 居中一个元素?你会想到啥?这里面的知识还真不少。包括水平居中,垂直居中,还有水...

    watercwaterc 评论0 收藏0
  • background 线性渐变

    background 线性渐变

    摘要:设置渐变为从右到左。用于指定渐变的起止颜色指定颜色。第一个值设置宽度,第二个值设置高度。背景图像的某些部分也许无法显示在背景定位区域中。 格式: background: linear-gradient(direction, color-stop1, color-stop2, ...); = linear-gradient...

    xioquaxioqua 评论0 收藏0
  • 前端每日实战:32# 视频演示如何用纯 CSS 创作六边形按钮特效

    前端每日实战:32# 视频演示如何用纯 CSS 创作六边形按钮特效

    摘要:源代码下载每日前端实战系列的全部源代码请从下载代码解读定义,容器中只包含个按钮定义按钮样式用伪元素增加个倾斜的矩形增加鼠标划过效果中增加几个按钮,形成一组按钮按钮之间为鼠标划过效果留出边距再增加两组按钮最后,尝试一些变化大功告成 show...

    andycallandycall 评论0 收藏0
  • CSS基础

    CSS基础

    摘要:块级元素默认设置为,行内元素默认设置为。颜色值是阴影的基本颜色。如持久导航菜单元素的位置通过以及属性进行规定。粘性定位该定位基于用户滚动的位置。 溢流(Overflow ) • auto:如果内容太多,那么超出盒子大小的内容会被隐藏,滚动条显示出来...

    AtomAtom 评论0 收藏0
  • React解决长列表方案(react-virtualized)

    React解决长列表方案(react-virtualized)

    摘要:缺点滑动过快,可能会出现空白的情况。前端经典问题,在中操作渲染大量在当中直接操作,会导致性能严重下降,所以渲染长列表也就是大量,会导致浏览器卡顿严重,甚至有可能出现假死状态。 github地址 高效渲染大型列表的响应式组件 使用窗口特性,即...

    NotFoundNotFound 评论0 收藏0
  • 基于element UI 的上传插件

    基于element UI 的上传插件

    摘要:为了不再重复的上传文件,做了一个统一选择文件和上传文件的基于演示用法上传地址是否可以多选允许选择的文件后缀也是允许上传的文件后缀上传的文件大小每页显示多少选择文件时的事件如果是多选模式,则就是多选后点击确定按钮的事件参数为选择的文件列...

    NikoManiacNikoManiac 评论0 收藏0
  • 前端每日实战:33# 视频演示如何用纯 CSS 创作牛奶文字变换效果

    前端每日实战:33# 视频演示如何用纯 CSS 创作牛奶文字变换效果

    摘要:源代码下载每日前端实战系列的全部源代码请从下载代码解读定义,容器中包含段文本居中显示设置字体样式让段文本重叠定义动画,让段文本交替显示增加字间距的变化效果增加文本模糊效果最后,为容器设置对比度滤镜大功告成 showImg("https://segmentfaul...

    mudiyouyoumudiyouyou 评论0 收藏0

热门文章

<