文章库ARTICLE COLUMN

  • 关于CSS Reset 那些事(二)之 Normalize.css 源码解读

    关于CSS Reset 那些事(二)之 Normalize.css 源码解读

    摘要:前言上一章节介绍了的历史,最后对做了简单的了解,所以从这节开始对源码进行注释翻译与解读,尽可能从最根本性的问题了解它在帮我们做什么回顾关于那些事一之历史演变与源码解读前面讲到的分模块解读,就是先黏贴一段源码,然后根据官方提供的注释进行...

    qujianqujian 评论0 收藏0
  • 关于CSS Reset 那些事(三)之 Normalize-zh.css 出炉

    关于CSS Reset 那些事(三)之 Normalize-zh.css 出炉

    摘要:本章节会完成所有源代码翻译整理,最终会整理出中文版本并开源至供大家交流使用。现已将源代码开源至项目地址源码解读上章节对与元素,元素,链接,语义化文本,内嵌元素,群组元素等源码内容已经做了解析,这章节继续完成表单,表格部分。 前言 上一...

    harryhappyharryhappy 评论0 收藏0
  • CSS黑科技补充篇

    CSS黑科技补充篇

    摘要:原文来自继上一次写的黑科技之后,这次貌似还专门去找了一些中可能还是比较不太会引起开发者注意的属性。其实在中,你可以使用这个属性来指定相应的样式,比如上面这一行声明就可以将元素中的空单元格隐藏起来。暂时就补充这么多 原文来自:https:/...

    LeanCloudLeanCloud 评论0 收藏0
  • 怎么检测图片完全加载完毕或者成功

    怎么检测图片完全加载完毕或者成功

    摘要:图片的属性可以检查一个图片是否完全加载成功了,图片加载会有一个事件发生它只代表图片已经开始加载了,不代表是否加载成功。 图片的属性complete可以检查一个图片是否完全加载成功了,图片加载会有一个事件img.onload发生(它只代表图片已经开始加载...

    leejan97leejan97 评论0 收藏0
  • 纯CSS制作各种图形(多图预警)

    纯CSS制作各种图形(多图预警)

    摘要:今天在国外一网站看到的,看了一下,也不复杂,只是平时没有用心去思考用心思考埋头赶路正方形矩形圆形可以使用百分比值大于,但是低版本的不支持椭圆形可以使用百分比值大于,但是低版本的不支持向上的三角形向下 今天在国外一网站(The Shapes of CSS...

    caigecaige 评论0 收藏0
  • 论 CSS 中的逻辑

    论 CSS 中的逻辑

    摘要:天生缺乏逻辑性的问题导致了预处理器的出现。这会导致圈复杂度问题。圈复杂度对于来说可能是一种比较高阶的原则,但如果我们通过它来考量那些蕴含在我们写的选择器中的逻辑性,那我们也许就能写出更加优秀的代码。 本文在征得原作者 @csswizardry ...

    PiscesYEPiscesYE 评论0 收藏0
  • 用CSS绘制三角形

    用CSS绘制三角形

    摘要:代码如下代码代码效果如下绘制此时,我们就可以根据上述的内容画出不同朝向的三角形了,例如当我们需要一个朝上的三角形,就不需要设置上边框,其他的以此类推。 引入 用 CSS 绘制三角形,只是对 border 属性的简单应用。平时使用 border 属性的时候...

    hover_lewhover_lew 评论0 收藏0
  • CSS Stacking Context 里那些鲜为人知的坑

    CSS Stacking Context 里那些鲜为人知的坑

    摘要:我们通过给已定位元素指定值以改变元素在其中轴的相对偏移量。这里的相对偏移指的是以为基准,相对于其它兄弟元素距离用户远近的顺序。以上便是我对中造成诸多匪夷所思现象原因的总结。目前这个仍未被解决,官方建议避免在元素下做定位。 通常我们在学...

    OldPandaOldPanda 评论0 收藏0
  • vertical-align属性与垂直居中

    vertical-align属性与垂直居中

    摘要:方法二利用,设置元素结构,并应用实现垂直居中,这种方法的实现可用于多行文本,要求及以上版本。 让元素居中对齐是非常常见的需求,首先是水平居中,要实现水平居中行内元素只需要在其父元素上设置text-align: center即可,对于块级元素来说让它的ma...

    bergwhitebergwhite 评论0 收藏0
  • 在 CSS 预编译器之后:PostCSS

    在 CSS 预编译器之后:PostCSS

    摘要:提到预编译器,你可能想到以及。而本文要介绍的,正是一个这样的工具预编译器可以做到的事,它同样可以做到。所以,预编译器过时了吗当然不会。等预编译器的特点是成熟可靠。此外,预编译器和可以协同使用。 提到css预编译器(css preprocessor),你...

    NeverSayNeverNeverSayNever 评论0 收藏0
  • body标签子级被默认client width截断的解决方法

    body标签子级被默认client width截断的解决方法

    答案: 为body 添加float属性: body{float:left}; /right float 就不大一样了,会没有机会显示左侧内容/

    xiaoqibTnxiaoqibTn 评论0 收藏0
  • 浏览器 CSS Hack 收集

    浏览器 CSS Hack 收集

    摘要:所谓的就是只有特定浏览器才能识别这段代码。不是什么好东西,除非没有办法,我们尽量还是不要用着玩意。下面是各个浏览器的列表。浏览器支持所有内核的浏览器包括内核浏览器浏览器浏览器浏览器针对不同的版本有不同个方式。 所谓的Hack就是只有特定浏...

    iKcampiKcamp 评论0 收藏0
  • 清除float对文档流影响的两种方式分析

    清除float对文档流影响的两种方式分析

    摘要:对文档流的影响在元素之后的元素会被填充到没有被元素占用的中。我们就需要对进行清除。使用清除的影响可以在元素的父元素中设置。在这个之后的不在这个里,所以不受的影响,即从视觉上消除了的影响。 float对文档流的影响 在float元素之后的元素会被...

    starsfunstarsfun 评论0 收藏0
  • CSS和Js一些笔记

    CSS和Js一些笔记

    showImg("https://segmentfault.com/img/bVmiRU"); 2.js控制图片 var img = new Image(); img.src = oImg[0].src = this.src.replace(/small/,"big"); oDiv.style.display = "block"; i...

    25012079502501207950 评论0 收藏0
  • 【译】下一代选择器:CSS4

    【译】下一代选择器:CSS4

    摘要:默认选项伪类伪类会匹配那些在一组相关的集合中作为默认选项的元素。浏览器对和支持范围伪类和这两个伪类对于那些要求数据介于一个指定范围的表单元素是非常有用的。因而应该像这样子的注意默认值是,不在数据允许的范围之内。 2014年1月,我写了一篇...

    yangrdyangrd 评论0 收藏0
  • CSS:hover选择器

    CSS:hover选择器

    摘要:选择器用于选择鼠标指针浮动在上面的元素。注意一开始我以为选择器只可用于链接上,但事实上,它竟可以用于所有的元素。在定义中,必须位于和之后如果存在的话,这样才可以生效。第二个注意事项,可以改变的位置来验证当鼠标滑过时,字体变红 在鼠标浮...

    XFLYXFLY 评论0 收藏0
  • 页面加速优化

    页面加速优化

    摘要:延迟加载当我们调用外部的时候,使用事件在页面内部被加载前,外部将不被加载脚本调用外部文件拷贝以上代码。代码代码片段组合外部工具列表页面加速优化页面请求工具工具大全扩展阅读方面的设置 内联 CSS 优点 使用内联 CSS 可以减少浏览器去服务端...

    Lin_YTLin_YT 评论0 收藏0
  • CSS用法的一些总结

    CSS用法的一些总结

    摘要:黄金档未垂直对齐同一行的一组为的使用了或者是时,如果某个的内部标签中填充一些文字等内容,可能就会出现垂直不对齐的情况。解决方法倒不难的应用会被其他一些属性破坏,例如和,所以与或是属性最好不要同用。 工作上,除了Django和一些并不复杂的脚...

    AnchorerAnchorer 评论0 收藏0
  • [ 学习路线 ] 2015 前端(JS)工程师必知必会 (2)

    [ 学习路线 ] 2015 前端(JS)工程师必知必会 (2)

    摘要:转自前端外刊评论非常感谢,翻译的很好,受益很多,转到此处让前端小伙伴们也惊呆下上次我写前端工程师必知必会已经是三年前了,那是我写过最火的文章了。测试的第二大障碍是工具。 转自:前端外刊评论 非常感谢,翻译的很好,受益很多,转到此处...

    stefanstefan 评论0 收藏0
  • 如何写出高效率的HTML

    如何写出高效率的HTML

    摘要:之所以写这篇文章,就是为了告诉你如何写出干净整洁的代码,能够让你的网页在许多设备上都能快速正常的加载运行。在这个过程中,你能够学会如何搭建易于维护和的网站以及。无论如何,尽量避免同时在和,或者和添加。 个人翻译,欢迎转载! 英文原...

    lsxiaolsxiao 评论0 收藏0
  • 如何做好移动端的响应式设计:Viewport控制

    如何做好移动端的响应式设计:Viewport控制

    摘要:当我们想根据屏幕尺寸来自动变化页面布局时,我们会像这样做在浏览器上调整窗口大小,可以看到网页的响应能力是乎没有任何问题的。在正式发布之前,还是先继续使用标签吧,如果有兴趣的话可以尝试一下测试版的。 新人翻译,欢迎转载~ 英文原文地...

    DevWikiDevWiki 评论0 收藏0
  • 移动端图片有间隙问题解决方法

    移动端图片有间隙问题解决方法

    今天在写移动端页面。遇到一个bug:图片会有一个3px或者4px的间隙。 解决方案: .img{ vertical-align:bottom; display:block; }

    Dionysus_goDionysus_go 评论0 收藏0
  • 关于CSS中的字体尺寸设置

    关于CSS中的字体尺寸设置

    摘要:常用单位在中可以用很多不同的方式来设定字体的尺寸。当你为一个元素添加单位时,应当考虑到所有父元素的字体尺寸。例宽度是中新提出的一个单位,通过宽度来计算字体尺寸。 个人翻译,转载请注明出处 英文原文:CSS Font Sizing 写在前面 上一...

    mcterrymcterry 评论0 收藏0
  • css中应该滚瓜烂熟的属性

    css中应该滚瓜烂熟的属性

    摘要:设置盒子的内边距内边距也是透明的。边框必须要设置类型,否则将无效。设置盒子的浮动,浮动是绝对定位的一种,其占位空间将消失。和通常都是和一起使用的。那两个伪类的绝对定位,由非常强大的威力,很多地方都可以用。比如微信的小红点消息通知。 Te...

    pekonchanpekonchan 评论0 收藏0
  • 多说自定义CSS动感头像和多说评论显示User Agent的那些小事

    多说自定义CSS动感头像和多说评论显示User Agent的那些小事

    摘要:之前看到很多朋友自豪的使用时会选择多说作为第三方评论插件,民间的高手们也根据官方的开发出一些十分有趣的隐藏属性。 showImg("https://segmentfault.com/img/remote/1460000004879308"); 前言 多说是一款社会化评论系统,她改变了网站与用户之间...

    beanlambeanlam 评论0 收藏0

热门文章

<