文章库ARTICLE COLUMN

  • JS / CSS 常用实战代码片段

    JS / CSS 常用实战代码片段

    摘要:常用模式片段之摘要第一次看到这个字眼是在中,即。之后也见到一些别人的代码里有,它和页面的有什么关系,以及和有何渊源。以前都见过这些词,但都似懂非懂,今天查了些资料收集了些代码,做个完整的理解。 CSS篇 常用模式片段之CSS布局篇 http://jso...

    sutakingsutaking 评论0 收藏0
  • 【windows】Idea+ruby+Gem+Scss搭建css开发环境

    【windows】Idea+ruby+Gem+Scss搭建css开发环境

    摘要:安装完成之后,我们需要为添加插件其中,的配置为安装成功,重启编辑器即可。 1.先安装最新版的ruby: 传送门:http://rubyinstaller.org/downloads/ 安装的时候,一定要允许写入环境变量(add to Path) 需要安装对应的安装包(64位或者32位) 2.安装...

    seanHaiseanHai 评论0 收藏0
  • 前端基础代码查询笔记(持续更新)

    前端基础代码查询笔记(持续更新)

    摘要:字体及符号字体如黑体忽略对整个符号的解析如换行空格个英文字符为一个中文,因此首行退格中文需要个抬头距离水平分割线如双符号商标注册商标版权符号上标下标中划线删除效果文字滚动也支持图文板块滚动方向速度方式默认循环来回循环一次停止设置次数时...

    BettaBetta 评论0 收藏0
  • Bootstrap 栅格布局

    Bootstrap 栅格布局

    摘要:类似和这种预定义的类,可以用来快速创建栅格布局。栅格系统组成的重要部分是使用了。必然导致了脱离文档流对布局的影响。 栅格布局系统: 思想:一个表达式足以描述, 百分比占位 + 多媒体查询 + float + relative Bootstrap栅格系统的工作原理: ro...

    chnmagnuschnmagnus 评论0 收藏0
  • vue中class和style设置的相关方法

    vue中class和style设置的相关方法

    摘要:样式设置代码阿斯顿发代码代码样式生效的写法调用的是参数里的属性第二种方法也是可以调用参数了的属性的记住,里面一切皆是数据第二种方法的精简版,官方版本和基本相同注意复合样式的书写规范阿斯顿发对应的是里的两个数据 class&style样式设置 clas...

    hearawayhearaway 评论0 收藏0
  • CSS选择器整理

    CSS选择器整理

    摘要:在及以下,伪类选择器与兄弟选择符一起使用会有一个,查看详情。一般用于输入框设置元素被选择时的字体颜色和背景颜色注意事项在使用时需要加上各个浏览器的前缀除了是,其他浏览器都是使用。总结选择器用得好其实可以让我们少些很多代码。 很多人都觉...

    张宪坤张宪坤 评论0 收藏0
  • 前端代码风格

    前端代码风格

    摘要:声明顺序相关的属性声明应该以下面的顺序分组处理盒模型排版外观处在第一位,因为他可以使一个元素脱离正常文本流,并且覆盖盒模型相关的样式。关于完整的属性以及他们的顺序,请参考命名保持命名为全小写,可以使用短划线不要使用下划线和命名。 文件...

    yzzzyzzz 评论0 收藏0
  • 用CSS画简单图标

    用CSS画简单图标

    摘要:用画了三个图标,叉号,排行符号,搜索符号。我们用和伪类来分别当一个矩形框,然后进行旋转即可得到叉号。我们用添加类的形式插入叉号,当我们需要插入叉号时,我们额外添加一个标记,并添加类。方便相对于父元素进行定位第二步,设置伪类,画叉号。 ...

    since1986since1986 评论0 收藏0
  • compass watch 报CompatibilityError 解决方案

    compass watch 报CompatibilityError 解决方案

    摘要:从一个项目下来后,执行报错。如下开始看到这个一头雾水,之后查阅了资料,发现是因为文件夹带中文的原因。将文件夹全部改为英文后,再进行就正常了。 从 gitlab clone 一个项目下来后,执行compass watch 报错。如下:showImg("https://segmentfault....

    JoonasJoonas 评论0 收藏0
  • bowl - 轻量级的前端资源缓存加载器

    bowl - 轻量级的前端资源缓存加载器

    摘要:另外,它不仅可以管理前端资源的缓存,在不需要缓存的时候也可以作为一个普通的加载器来使用,页面中用到的和资源都可以用它来加载。 现在单页应用越来越多,前端能做的事也越来越多,但随之而来的问题是一个单页应用的 CSS 和 JavaScript 代码的体积...

    longshengwanglongshengwang 评论0 收藏0
  • CSS三栏布局的四种方法

    CSS三栏布局的四种方法

    摘要:浮动代码如下注意元素次序代码如下左栏左浮动中间自适应右栏右浮动这种方式代码足够简洁与高效,也容易理解后记四种方法其实只有圣杯布局和双飞翼布局较难理解,但实际上理解了圣杯布局,双飞翼布局自然就理解了。 前言 总括: 不管是三栏布局还是两栏...

    RobinQuRobinQu 评论0 收藏0
  • 通过js动态设置根元素的rem方案

    通过js动态设置根元素的rem方案

    摘要:方案二获取元素判断是屏幕旋转还是设置的,随着的改变而改变。以上两种方案均为通过动态设置的根元素的的值来达到响应式的效果。原文链接通过动态设置根元素的方案 rem目前是响应式开发移动端一个很重要也是常用的一个元素,但是在网上看的各种文章都...

    zhangfaliangzhangfaliang 评论0 收藏0
  • 移动端解决方案学习记录

    移动端解决方案学习记录

    摘要:先附上参考资料链接移动端适配方案上移动端适配方案下可伸缩布局方案一个的值转值的自动完成插件。 先附上参考资料链接; 移动端适配方案(上) 移动端适配方案(下) 可伸缩布局方案 一个CSS的px值转rem值的Sublime Text 3自动完成插件。 最终测试了 li...

    honhonhonhon 评论0 收藏0
  • 我所知道的flex布局 —— 上篇

    我所知道的flex布局 —— 上篇

    摘要:布局也经历了一段演变历史。不同于将要出现的网格布局针对目标为大比例布局,弹性盒布局更适用于应用组件和小比例布局。常规布局是基于块和内联流方向,而布局是基于流。 前言 你还在用display+position+float来进行css布局吗?有没有觉得用传统的这种...

    andycallandycall 评论0 收藏0
  • Web如何防止XSS攻击

    Web如何防止XSS攻击

    摘要:危害实例微博年月日晚,新浪微博遭遇到蠕虫攻击侵袭,在不到一个小时的时间,超过万微博用户受到该蠕虫的攻击。此事件给严重依赖社交网络的网友们敲响了警钟。当用户看到这样的情况可以反馈,及时封堵恶意作者的攻击。 什么是XSS 跨站脚本攻击(Cross S...

    XboxYanXboxYan 评论0 收藏0
  • 简单粗暴的移动端页面开发技能

    简单粗暴的移动端页面开发技能

    摘要:移动端响应式页面开发说简单也简单,根据屏幕尺寸调节根字体大小。大宽度用,高度和小宽度全部使用,简单粗暴。之前阅读过大漠老师的使用实现手淘页面的终端适配介绍了手淘项目的制作规范。 移动端响应式页面开发说简单也简单,根据屏幕尺寸调节根字体...

    jeffrey_upjeffrey_up 评论0 收藏0
  • Canvas绘画一个时钟

    Canvas绘画一个时钟

    摘要:绘画一个时钟时钟样式每隔一秒调用一次函数保存最原始的画布状态,如此便不需要清除整个画布新的画布状态,将圆心移到原始画布状态的处将整个坐标系选择,方便显示之后的时间数字,以保证在顶部即是十二边形定义表盘半径保存当前状态即是第一个状 tit...

    alaegealaege 评论0 收藏0
  • CSS水平垂直居中总结

    CSS水平垂直居中总结

    摘要:垂直居中表格布局法为什么就能垂直居中拜读了张鑫旭大神的文章行高指的是什么行高指的是文本行的基线间的距离。行内框具有垂直居中性。 CSS水平居中、垂直居中、水平垂直居中方法总结 文字的水平居中: text-align:center; 单行文字的垂直居中: line-h...

    mist14mist14 评论0 收藏0
  • css创建优雅自然的打开动画

    css创建优雅自然的打开动画

    摘要:前言花了很大篇幅介绍了优雅自然的动画应该具备哪些特性。接下来,用打开一个动画的例子,来说说本人对的认识。一个最简单的打开动画,可能涉及移动和放大。最后,将两种运动的代码结合在一起就能创建优雅自然的打开动画啦。 前言 Google Material Des...

    xuhongxuhong 评论0 收藏0
  • CSS结构与布局

    CSS结构与布局

    摘要:当列表中至少包含四项时,命中包括该项之后的所有列表项当然,不止于此,的玩法完全取决于你的脑洞。而且绝对定位对整个布局的影响也太过强烈。如此,对于响应布局也可以不用担心了,虽然有点点,但也算完美的解决了, title: 结构与布局date: 2016-1...

    figofuturefigofuture 评论0 收藏0
  • CSS居中那些事

    CSS居中那些事

    摘要:定宽块状元素满足定宽和块状两个条件的元素是可以通过设置左右值为来实现居中的。设置方法改变块级元素的为类型设置为行内元素显示,然后使用来实现居中效果。 做前端这一年多来,其实一直都是偏向于js前后端,css什么的总是抱着够用就好的心态,从来...

    dingding199389dingding199389 评论0 收藏0
  • 如何合理的规划前端之路

    如何合理的规划前端之路

    摘要:什么是前端工程师总而言之就是运用等技术,在工作中配合设计师实现用户界面,和后端工程师进行数据对接,完成应用开发的职位。 什么是前端工程师?总而言之,就是运用 HTML、CSS、JavaScript 等 Web 技术,在工作中配合UI设计师实现用户界面,和后端工...

    lwx12525lwx12525 评论0 收藏0
  • 前端性能优化黄金法则

    前端性能优化黄金法则

    摘要:前端优化是复杂的,针对方方面面的资源都有不同的方式。前端性能优化前端性能团队总结的条黄金定律的团队总结出了一系列可以提高网站速度的方法。提高性能的措施中最重要的方法就是使响应具有可缓存性。 前端是庞大的,包括 HTML、 CSS、 Javascript、...

    coolpailcoolpail 评论0 收藏0
  • 移动端实现内滚动的4种方案

    移动端实现内滚动的4种方案

    摘要:部分区域固定其余区域滚动部分区域固定为页面的部分设置以及,即禁用页面原生的滚动,保证只会显示一屏的内容。但是单位对低版本安卓和支持不够好,微信浏览器内核不支持,虽然已经升级到内核,但是为了确保万无一失,放弃采用这种方案。 如果在一个区...

    CodeSheepCodeSheep 评论0 收藏0
  • css记录收集

    css记录收集

    让一个块级元素在某区域内上下左右居中 .container { border: 1px solid #000; width: 300px; height: 300px; position: relative; } .box { border: 1px solid #000; width: 50px; height: 50px; /* magic below */ position: ...

    233jl233jl 评论0 收藏0

热门文章

<