文章库ARTICLE COLUMN

  • CSS动画:有活力的链接下划线

    CSS动画:有活力的链接下划线

    摘要:链接下划线是非常常见的一种样式,最近做了一个非常简单的视觉效果,非常不错,可以点下面链接查看。最后设置动画时间为,现在我们只需要设置元素在时显示并且大功告成这样就完成了一个很有活力的下划线动画 链接下划线是非常常见的一种样式,最近做了...

    lifesimplelifesimple 评论0 收藏0
  • Background背景色透明RGBA和opacity的对比实例(转载)

    Background背景色透明RGBA和opacity的对比实例(转载)

    摘要:浏览器的兼容性如果庞统说是制作透明色透明背景色透明边框色透明前景色等,大家不由会想起这个东西。 Background背景色透明RGBA时间:2013-03-16 00:44│来自: 信有UED│作者:JUN│点击:9704次RGB不用说,大家都知道是什么,但RGBA是什么呢? 1 2 backg...

    jindongjindong 评论0 收藏0
  • 深入理解line-height

    深入理解line-height

    摘要:初学者也许会对这句话嗤之以鼻,但随着我学习的深入,渐渐意识这句话还是有一定道理的。然而,我们真的了解它吗又是由什么来决定的首先推荐一篇文章,深入了解的行高属性假设你已经读完了这篇文章并且已经大致理解那么这张图应该能看懂了。 HTML和CSS...

    chemzqmchemzqm 评论0 收藏0
  • bigSlide 插件应用

    bigSlide 插件应用

    摘要:一插件官网二基本代码侧边栏控制开关用一个标签来控制侧边栏的开关。插件初始化最后则需要在标签尾部加上初始化插件的代码。另外侧边栏并不需要随着页面的上下滚动始终显示在视口中,所以默认的这个语句并不需要。 一、 插件官网 bigSlide.js 二、 基...

    MrZONTMrZONT 评论0 收藏0
  • (CSS) 不同浏览器对table中visibility属性显示的不同

    (CSS) 不同浏览器对table中visibility属性显示的不同

    摘要:本文举例说明在不同浏览器对中属性显示的不同。一代码二不同浏览器的表示选取了分别测试,下文所有图片从左至右顺序均如前所述。若使不同浏览器显示相同结果,可对或设置。我并没有找到产生上述结果的原因,只能认为是不同浏览器处理结果的不同。 本文...

    LsnshLsnsh 评论0 收藏0
  • 兼容性总结

    兼容性总结

    摘要:写在前面的话,也不知道还要不要管,晕晕乎乎的兼容性引用在元素浮动,如果宽度需要内容撑开,就给里边的块元素都加浮动例左侧右侧给它设置显示如下解决办法在下元素要通过浮动并在同一行,就给这行元素都加浮动例样式结果解决都浮动注意标签嵌套规范例...

    CoXieCoXie 评论0 收藏0
  • CSS Background-Size 属性小记

    CSS Background-Size 属性小记

    摘要:最后为了实现背景图片铺满浏览器窗口的需求,将背景图裁剪成了的比例,并且用属性,这样就可以满足大部分的应用场景了。 今天在研究用 CSS 实现背景图片铺满浏览器窗口的方法,先是在 StackOverflow 上找到一个方法 show full height background image...

    parallerparaller 评论0 收藏0
  • [译]关于垂直居中 Vertical Align 的探讨

    [译]关于垂直居中 Vertical Align 的探讨

    摘要:为子元素设置属性和,令子元素的顶部在纵向上与父元素中间的位置对齐。为子元素设置属性,其中为子元素高度值的一半,相当于再将子元素向上移动其本身高度的一半距离,这样就可以令其垂直居中了。 原文出处:Understanding vertical-align, or "How (N...

    lscholscho 评论0 收藏0
  • [译]CSS 居中(Center)方法大合集

    [译]CSS 居中(Center)方法大合集

    摘要:并排显示,要求相同高度如果要求多个块级元素并排居中且高度相同,则要为其父元素设置属性。成一列显示如果只是需要让多个块级元素整体水平居中,并且按默认的方式纵向排列,那直接设置左右边距为即可。 原文出处:Centering in CSS: A Complete Guide...

    wayneliwayneli 评论0 收藏0
  • 元素上下层叠关系总结

    元素上下层叠关系总结

    摘要:嗒哒,什么属性的元素有什么样的层叠等级,按照这张图上面的问题就简单了,在负值上,在或正值之下。咦这里咋还有的事呢,还这么高等级捏这是因为内容要大于布局,不展开顶部有鑫旭大神的文章,里面有做介绍。 showImg("https://segmentfault.com/img/...

    vvpvvpvvpvvp 评论0 收藏0
  • 网站入口页双栏对称布局实现思路

    网站入口页双栏对称布局实现思路

    摘要:左右两部分对称显示,属性均为,属性均为,属性均为,属性则分别为和。底部此部分的样式设置与顶部导航栏的类似,只是需要将版权信息相关的文字在水平和垂直两个方向上均居中对齐即可。 先来一张预览图。 showImg("https://segmentfault.com/img/bVwC3...

    csRyancsRyan 评论0 收藏0
  • web前端教程《每日一题》(1-99)完结

    web前端教程《每日一题》(1-99)完结

    摘要:输出在中,值表示一个空对象指针,而这正是使用操作符检测值时会返回的原因。属性规定必需在提交之前填写输入字段。通过字面量方式创建的数组对象是属于类的一个实例,所以返回,故弹出。第期年月日代码运行的结果输出前端教程。 第1期(2016年4月6日...

    forsignerforsigner 评论0 收藏0
  • 如何直接访问github的html项目

    如何直接访问github的html项目

    摘要:当时就去查了许多资料,百度里说得各种天花乱坠,没点用,我只想说能不能有点公德心,像百度上什么什么认证的人都是胡说八道,回答的牛头不对马嘴。 我其实也是个刚刚入行没多久的新人,github玩的比较少,上次发了一篇文章,部门老大希望我在github上...

    JuvenJuven 评论0 收藏0
  • border、outline、boxshadow那些事以及如何做内凹圆

    border、outline、boxshadow那些事以及如何做内凹圆

    摘要:线性渐变不过它稍稍有些复杂。在讲解径向渐变之前,我们先来看一看比较简单的线性渐变。再来看径向渐变好的,接下来我们来看径向渐变。但对径向渐变来说,顾名思议,所有色标是排布在一条半径上的。 border 边框是我们美化网页、增强样式最常用的手段...

    libin19890520libin19890520 评论0 收藏0
  • 想要清晰的明白(二)CSS 盒模型Block box与Line box

    想要清晰的明白(二)CSS 盒模型Block box与Line box

    摘要:垂直格式化,有一个很重要的方面是会造成垂直相邻外边距合并,解决这个的方式见想要清晰的明白一中的部分。参考资料权威指南第三版为负值产生的影响和常见布局应用布局圣杯布局双飞翼布局深入理解和的基友关系深入理解中的行高 在上一篇想要清晰的明白...

    VickyVicky 评论0 收藏0
  • CSS 居中完全指南

    CSS 居中完全指南

    摘要:在文本前面插入一个高度为百分百的伪元素,让文本与其垂直对齐。块级元素或者使用垂直水平居中或者使用 翻译自 https://css-tricks.com/centering-css-complete-guide/ 预先给出这样的样式 .container { width: 100%; height: 200px; b...

    hqmanhqman 评论0 收藏0
  • transform,transition,animation

    transform,transition,animation

    摘要:,三者的区别是多带带的形变,偏移,而和都加上了时间属性,所以能够产生动画效果。的动画效果一般由行为等触发,而则是自动触发。的动画效果只有两帧关键帧,而可以有更多帧。默认为,即两个动作间产生变化的所有属性都发生作用。 transform,transi...

    xuexiangjysxuexiangjys 评论0 收藏0
  • rem : web app适配的秘密武器

    rem : web app适配的秘密武器

    摘要:有与两种方式来调整元素大小的值。如果你的页面还需要适配到端,那么就老老实实的使用吧。在上面的实现中,我通过判断设定了字体大小的范围来避免上显示过于夸张。二有的同学可能对的适配有点误解。 最近看到这样一个提问:我有一个750 x 1500尺寸的设...

    MageekChiuMageekChiu 评论0 收藏0
  • 看到一种css实现圆角的方法

    看到一种css实现圆角的方法

    摘要:实现圆角,最常用的是使用背景图和属性。优点可拉伸,简单方便,实现缺点只兼容现代浏览器看到的方法这个方法就略奇葩,但确实出现在了我们的产品中。具体来说使用几个标签,用控制宽度,从上到下一次变长,造成一种圆角的感觉。 实现圆角,最常用的是...

    int64int64 评论0 收藏0
  • 如何进行页面优化?

    如何进行页面优化?

    摘要:所有表现用实现模块化命名规范语义化尽量减少页面懒加载少用操作加注释 为什么要进行页面优化? 更快:页面加载更快,客户感知更快; 更易于阅读:易于搜索引擎抓页面重点,易于盲人阅读; 更易于维护:易于自己和同事后期读懂、定位、修改和扩展代码. ...

    cjiecjie 评论0 收藏0
  • CSS中Background浅析

    CSS中Background浅析

    摘要:如果只指定其中一个值,另一个值会被设定为因此可以和混用。通过设定负的,背景图像的一部分被拖拽到父元素之外,从而在父元素之内显示要显示的内容。随着的普及,相信渐变将成为主流。可以显示的显示范围。 作为一个有理想有包袱的页面仔,正像鑫哥在...

    objc94objc94 评论0 收藏0
  • 【二次元的CSS】—— 纯CSS3做的能换挡的电扇

    【二次元的CSS】—— 纯CSS3做的能换挡的电扇

    摘要:传送门效果是这样的结构小技巧就是,一开始就写了一组单选按钮来做开关的部分。有个地方需要优化,就是在换挡的时候,动画应该柔和些。 这次分享的电扇,和以往用css3画人物相比 多加了一点交互,就是电扇开关的地方,用到了一点点css3的 :checked +di...

    big_catbig_cat 评论0 收藏0
  • 浏览器渲染的那些事(一)

    浏览器渲染的那些事(一)

    摘要:浏览器的主要概念浏览器主要分为这及部分。浏览器会解析,事实上,有三个的类对应这三类文档。浏览器的错误处理相当统一,虽然这不是当前规范的一部分。 今天在推特看到一篇文章《当页面渲染时,浏览器发生了什么》,于是找了些资料,分享一下所得。 ...

    littleGrowlittleGrow 评论0 收藏0
  • 響應式設計中百分比 % 的問題

    響應式設計中百分比 % 的問題

    摘要:響應式自適應響應式和自適應設計共同點都是要處理在不同裝置下瀏覽網頁的問題,可讀性,版型等等。關於由於我們仍會在的設計中使用百分比,如此一來或多或少還是會受到進位誤差的影響,因此並不是佈局的萬能藥。 showImg("https://segmentfault.com/im...

    wangymwangym 评论0 收藏0
  • 浏览器渲染的那些事(二)

    浏览器渲染的那些事(二)

    摘要:接上一篇浏览器渲染的那些事一继续说。哈希表的选择器各不相同,包括,标记名称等。例如,如果选择器是,就把规则放入的哈希表中还有一种通用哈希表,适合不属于上述类别的规则。 接上一篇浏览器渲染的那些事(一)继续说。 构建呈现树 Render Tree/Fr...

    MadPeckerMadPecker 评论0 收藏0

热门文章

<