关注前端开发
关注用户体验

HTML/CSS

有HTML5、CSS3等最新的HTML和CSS知识
css动画是可以暂停的-大前端

css动画是可以暂停的

cc阅读(6249)赞(33)

css动画大家都不陌生,但是你知道css动画是可暂停的吗?如果你不知道就来看看吧。 虽然用过很多次animation,但是也就前几天才知道动画是可以暂停的,可见自己对动画的了解还是不够深,一起来学习一下今天的主角—animati...

css性能优化-will-change-大前端

css性能优化-will-change

cc阅读(2196)赞(14)

will-change通过告知浏览器该元素会有哪些变化,使浏览器提前做好优化准备,增强页面渲染性能。 属性的取值: 1、auto:  实行标准浏览器优化。 2、scroll-position:  表示开发者希望在不久后改变滚动条的位置或者使...

clip-path应用--制作地图-大前端

clip-path应用–制作地图

cc阅读(3180)赞(31)

一、实现原理 clip-path属性可以创建一个只有元素的部分区域可以显示的剪切区域。区域内的部分显示,区域外的隐藏。剪切区域是被引用内嵌的URL定义的路径或者外部svg的路径,也可以是一个形状如circle()。 二、所需数据 1、剪切区...

CSS之文本两端对齐-大前端

CSS之文本两端对齐

cc阅读(18809)赞(158)

说起text-align,大家一定都不觉得陌生,我们常用关键字left、right、center实现行内元素相对父元素左、右、居中对齐,当然我们也使用justify来实现文本两端对齐。 如上图,两端对齐相对于左对齐,视觉上显得整齐有序。但j...

这样的广告请再来一打  ---  background-attachment-大前端

这样的广告请再来一打 — background-attachment

cc阅读(8425)赞(58)

大多数时候,我们看到的广告都是固定在页面的某个位置,如下图的首页,一看就知道是硬广啦。     看到标题是不是很疑惑,什么样的广告,想再来一打?不废话,先来看看效果吧。 See the Pen 视觉差 by cc (@g...

初识 CSS Shapes     -----   (二)-大前端

初识 CSS Shapes —– (二)

cc阅读(7746)赞(27)

上一篇主要介绍了通过函数方法创建矩形、圆等基本图形,今天主要了解盒模型、图片计算出来的形状。 1、盒模型(包括 border-radius 的弧度) See the Pen shape-outside by cc (@glccgl) on ...

初识 CSS Shapes-大前端

初识 CSS Shapes

cc阅读(6038)赞(34)

先来看以下效果:右侧文本环圆环排版。 在未了解css shapes之前,实现这样的排版还是挺费事的,比如为每行设置不同的padding值。但是有了css shapes之后,两行css就搞定啦,一起来看看吧。   See the P...

CSS3-- filter(滤镜)-大前端

CSS3– filter(滤镜)

cc阅读(6588)赞(26)

早前做页面时遇到为降低赞助商板块的注意力,将logo置灰显示的处理,虽觉得寡淡,但因为还有其他的工作要做也就没有想过其他的效果,最近看vue文档(汗,其实是之前没注意),发现首页赞助商logo初始置灰鼠标悬停时高亮效果挺赞的,点此查看效,所...

chrome  transition闪烁BUG-大前端

chrome transition闪烁BUG

cc阅读(15525)赞(251)

    前段时间写鼠标悬停元素上移效果时,当鼠标恰好放在元素边缘时,chrome出现一直上下移动的问题,其他浏览器表现正常。原因尚不知,可能是实现方式不对吧(PS:使用top实现),虽然不知道原因,但...

HTML5-语义化-大前端

HTML5-语义化

cc阅读(23355)赞(261)

    距HTML5标准规范制定完成并公开发布已经有好些年了,面试时也少不了要问对HTML5语义化得理解。但是在实际运用时,真正使用HTML5标签来开发的似乎不是很多(ps:查看了几个巨头公司网站推论),可能一部分原因是仍有部分用户使用在使...

themebetter 国内更好的WordPress主题服务商

立即前往