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

HTML/CSS

有HTML5、CSS3等最新的HTML和CSS知识
CSS之文本两端对齐-大前端

CSS之文本两端对齐

cc阅读(250)赞(1)

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

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

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

cc阅读(1144)赞(11)

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

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

初识 CSS Shapes —– (二)

cc阅读(1577)赞(9)

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

初识 CSS Shapes-大前端

初识 CSS Shapes

cc阅读(1166)赞(14)

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

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

CSS3– filter(滤镜)

cc阅读(1641)赞(12)

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

chrome  transition闪烁BUG-大前端

chrome transition闪烁BUG

cc阅读(11110)赞(235)

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

HTML5-语义化-大前端

HTML5-语义化

cc阅读(13944)赞(236)

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

canvas小tip--下载二维码、图片加水印-大前端

canvas小tip–下载二维码、图片加水印

cc阅读(9879)赞(176)

    昨天介绍了一个生成二维码的插件QRCode.js,它是借助HTML5 Canvas绘制而成。所以,今天的主角就是canvas啦–canvas的实际应用。     一、下载二维码(查看如何生成二维码)     HTMLCa...

css print-大前端

css print

cc阅读(27068)赞(55)

最近做表单打印,遂整理了一些打印相关的内容。 说到网页打印,首先想到的便是@media查询(即网页css),通过使用媒体类型print即可解决实际应用的大多数问题,比如实现只打印网页的某部分内容,调整字体大小、修改布局等使打印出来的纸质文件...

css负边距之详解-大前端

css负边距之详解

浩子阅读(48366)赞(7)

自从1998年CSS2作为推荐以来,表格的使用渐渐退去,成为历史。正因为此,从那以后CSS布局成为了优雅代码的代名词。 对于所有设计师使用过的CSS概念,负边距作为最少讨论到的定位方式要记上一功。这就像是在线纹身-每个人都会做,但是没有人会...

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

立即前往