文章库ARTICLE COLUMN

  • 使用CSS clip 属性实现音频播放圆环进度条

    使用CSS clip 属性实现音频播放圆环进度条

    摘要:突然有需求要做一个圆环的音频播放进度条上图效果,自己琢磨尝试了半天,也没有实现。然后结合让这个半圆旋转,就实现了内的进度条,当超过时,取消对的剪裁,再使用一个半圆来保存的进条,就实现一个的进度条效果。 showImg("https://segmentfault.co...

    klivitamJklivitamJ 评论0 收藏0
  • 前端小白的全栈初体验

    前端小白的全栈初体验

    摘要:原文来源全栈初体验前言据说现在不会点后台的前端都找不到工作了吓得我这几天看起了和并且做了一个应该算是最简单的前后端例子,如图输入账户密码,提交表单,保存信息到数据库再重定向到页面获取数据库中的信息,渲染在浏览器上具体代码主要技术前端模...

    wangymwangym 评论0 收藏0
  • CSS的居中方式

    CSS的居中方式

    摘要:这样一来外部容器正好可以将内容垂直的包裹住并且由于外部容器是浮动的所以容器的宽度和内层的宽度一致这样可以做到完全自适应的实现居中。 刚学习CSS的时候尝试过几种居中的方法,这些方法不需要借助JS手段,所写的方法有一个原则,就是在不需要直接人...

    lushanlushan 评论0 收藏0
  • 用纯CSS 自定义radio checkbox 样式

    用纯CSS 自定义radio checkbox 样式

    摘要:以前做自定义样式的的时候,一直是如下结构文字然后定义的样式作为新再用做关联。知道今天才知道可以用标签的属性做,纯真是太不应该了,学东西还是要认真细致点。单选项示例如下效果示例作者 以前做自定义样式的radio, checkbox 的时候,一直是如下结...

    lolomacololomaco 评论0 收藏0
  • 【CSS】超出两行显示省略号

    【CSS】超出两行显示省略号

    摘要:看到了个问题,问题地址目前没想到怎样不用行高解决问题,但是想到了之前工作中遇到的文本超出两行显示省略号,所以从之前的代码里翻出代码段记录下来,便于之后使用。 看到了个问题,问题地址:https://segmentfault.com/q/10...目前没想到怎样不用行...

    cartooncartoon 评论0 收藏0
  • 有关响应式布局

    有关响应式布局

    摘要:范围为使用媒体查询对指定视图宽度范围的页面进行渲染例如 (持续更新中......) 设置meta 标签 注: width 和height 指令分别指定视区的逻辑宽度和高度,单位是以像素为单位的数字或特殊标记符号(如device-width); initial-scale 指页面初始缩...

    KavenFanKavenFan 评论0 收藏0
  • 重温"什么是响应式网页设计?响应式布局的实现原理"

    重温"什么是响应式网页设计?响应式布局的实现原理"

    摘要:概念响应式网页设计最初是由提出的一个概念为什么一定要为每个用户群各自打造一套设计和开发方案设计应该做到根据不同设备环境自动响应及调整。预计到年,移动互联网的数据流量将超越端的流量。 概念 响应式网页设计最初是由 Ethan Marcotte 提出的一...

    NekronNekron 评论0 收藏0
  • 快速构建一个使用axios的vue应用程序

    快速构建一个使用axios的vue应用程序

    摘要:要在我们的应用程序中显示模拟数据,可以在元素中写入指令用于渲染我们的列表。虽然这超出了本教程的范围,但建议用于更大或更复杂的应用程序。 这篇文章讲述了如何快速构建一个vue程序,并使用axios从远程获取数据。这是原文章的直通门 通常情况下,...

    williamwilliam 评论0 收藏0
  • border详解

    border详解

    border属性指定了盒的border区的width,color和style。这些属性适用于所有元素 border-width与百分比 border-width不支持百分比:不符合语义,边框不会因设备大小而变化 border-width默认是medium:3px,因为border-style:double至少3px才有效果 了解各种border...

    curriedcurried 评论0 收藏0
  • 盒模型(Box model)

    盒模型(Box model)

    摘要:盒模型描述了一个为文档树中的元素生成的并根据可视化格式模型进行布局的矩形框盒模型和盒模型在计算总宽度中存在一些差异在模型中和是指的宽度和高度在盒模型中和包含和以及的宽度和高度在中引入了属性它可以允许改变默认的盒模型对元素宽高的计算方式...

    gecko23gecko23 评论0 收藏0
  • 解剖CSS布局原理

    解剖CSS布局原理

    摘要:前言本文将带你重新认识布局,带你解剖布局原理,前提是你要有基础本文将解除你在布局方面的疑惑。以下将对布局元素和文档流进行详细讲解。而且还能保持文档流,这是其他元素做不到的。 前言 本文将带你重新认识CSS布局,带你解剖布局原理,前提是你要...

    李文鹏李文鹏 评论0 收藏0
  • Object.defineProperty小记

    Object.defineProperty小记

    摘要:为属性时才能被删除,才能更改属性,否则会报错。决定这个对象是否可以通过遍历到该属性。必须是设置为时的设置才能生效。相当于把方法执行了一次使用构造函数主要是限定自定义的和方法适用范围,例如上面的代码,就把这两个方法限定在下。 作用 可以...

    kviccnkviccn 评论0 收藏0
  • padding详解

    padding详解

    padding属性指定了盒的padding区的宽度。"padding"简写属性一次性设置四周的padding,而其它padding属性只设置它们各侧的 padding与元素的尺寸 padding与block和inline元素尺寸 最后一个例子是用padding实现高度可控的分隔线 padding与百分比值 padding百分...

    tomenertomener 评论0 收藏0
  • 第三次直播总结,兼谈技术教学

    第三次直播总结,兼谈技术教学

    摘要:前几天完成了第三场直播永恒不变的主题布局,,,这里总结一下。因为第二场直播比第一场多了十个人,差不多,让我以为自己取得了不小的进步,甚至上一次总结的时候还信心满满。但是第三场,前后只有不到个人加了进来。 前几天完成了第三场直播:《Web ...

    WrBugWrBug 评论0 收藏0
  • CSS代码重构与优化之路

    CSS代码重构与优化之路

    摘要:代码重构的目的我们写代码时,不仅仅只是完成页面设计的效果,还应该让代码易于管理,维护。命名与备注命名是提高代码可读性的第一步,也是及其重要的一步。 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多,如果没有及...

    fou7fou7 评论0 收藏0
  • JQuery干货篇之插入元素

    JQuery干货篇之插入元素

    摘要:在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点。当需要移走一个元素,不久又将该元素插入时,这种方法很有用。实例从中移除集合中匹配元素的所有子节点。 JQuery干货篇之插入元素 本次使用的html,css还是我上一篇的源代码,详...

    jemygrawjemygraw 评论0 收藏0
  • 页面架构HTML+CSS ヾ(o◕∀◕)ノ 常用居中&多列布局

    页面架构HTML+CSS ヾ(o◕∀◕)ノ 常用居中&多列布局

    CSS Reset 1.作用 (1)清除浏览器默认样式(2)全局样式定义 2.特别注意 (1)项目开发初期就定义好(2)reset.css 在引入的时候一定要放在第一位(3)不同的产品reset.css不一样 3.table合并边框间距 table { border-collapse: collapse; // 合并边框 ...

    NervosNetworkNervosNetwork 评论0 收藏0
  • 移动端1px线的实现

    移动端1px线的实现

    摘要:那么如何在移动端展示时分割线的高度小于呢常用方案通常的做法如下兼容问题定义完这个样式,在手机上看看,幸运的你可能会看到想要的效果已经展示了,然而这个存在兼容性问题,有的手机上线条没有展示,有的手机上会出现滑动屏幕时线条时有时无。 起因...

    jaysunjaysun 评论0 收藏0
  • WebUploader上传插件使用说明

    WebUploader上传插件使用说明

    摘要:否则强制转换成指定的类型。是否要分片处理大文件上传还有其他配置项上传事件选择需要上传的文件后,文件就会加入文件队列,并触发事件上传进度回调事件,在文件上传中,多次调用此事件当文件上传成功时触发当文件上传出错时触发。 WebUploader简述 ...

    xbynetxbynet 评论0 收藏0
  • 360前端星计划学习-HTML + CSS

    360前端星计划学习-HTML + CSS

    摘要:设计思想兼容已有内容避免不必要的复杂性解决现实问题优雅降级尊重事实标准变化新增语义化标签去除纯表示性的标签拖拽离线语法标签不区分大小写推荐小写空标签可以不闭合属性不必引号。遇到这种情况时,会生成匿名块级盒来包含行级盒。 浏览器 浏览...

    lpjustdoitlpjustdoit 评论0 收藏0
  • JQuery干货篇之处理元素

    JQuery干货篇之处理元素

    摘要:表示要设置的属性名称,返回值就是要设置的属性值实例设置字体大小使用相对值设置属性值,在原有的基础上加上获取标签的字体同时设置多个属性方法方法设置或返回被选元素的文本内容。 JQuery干货篇之处理元素 注意这里用的还是我前两篇用的例子,详情...

    tuantuantuantuan 评论0 收藏0
  • 用hexo搭建了我的线上博客

    用hexo搭建了我的线上博客

    摘要:前言看见好多人的博客下面都有的标志,所以我就想他们是怎么有这么样的一个又精美,又简单的线上博客呢抱着这样的心理,就去了发现了是有一个的基于的开发部件。如果你也想搭建这么一个博客我们也可以聊聊吹吹牛逼 前言 看见好多人的博客下面都有hexo...

    dinferdinfer 评论0 收藏0
  • 前端之HTML学习

    前端之HTML学习

    摘要:对基础有个全面的印象因为以后的升级学习离不开基础作为支持。作为新生的你,需要学习的是究竟该要查询什么关键词。最后再啰嗦一句,学习编程语言一定要避免手懒,只看不敲。 HTML学习 请带着以下几个问题进行学习: 什么是HTML、HTML文档类型起到...

    lemanlilemanli 评论0 收藏0
  • 等比例等间距布局实例

    等比例等间距布局实例

    摘要:这是一个很常用的布局,这里给出一种实现方案代码实现效果解析子元素等分排满屏幕宽度,父元素设置子元素设置,意思是宽度自动填满剩余空间,如果有多个并列子元素,会按照数值等比分配空间子元素间隔相等,所有子元素设置,第一个子元素使用伪类设 这...

    VickyVicky 评论0 收藏0
  • Sticky Footer 粘性底部-让底部一直在页面最下面

    Sticky Footer 粘性底部-让底部一直在页面最下面

    摘要:具体实例页面请看方法一绝对定位并加一层父元素不识别页面头部页面主体内容页面底部方法二绝对定位以为父元素页面头部页面主体内容页面底部方法三加负值上边距页面头部页面主体内容页面底部 具体实例页面请看github 方法一:footer绝对定位-并加一层父...

    ethernetethernet 评论0 收藏0

热门文章

<