![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS3
suwyer
这个作者很懒,什么都没留下…
展开
-
CSS3绘制不规则图形(一)
由于近期的项目中出现了不规则的边框和图形, 所以只好提前先温习一下,以前收集的一些CSS3绘制的图形。。。样式绘制的图形比图片的性能要好,体验更佳。废话不多说,我们直接看效果:1、三角形系列(三角形、倒三角、左三角、右三角、左上三角、右上三角、左下三角、右下三角) 主要用到的是:宽度高度设置为0, border的各个边的设置(各个边的透明或不透明); .tri...原创 2018-07-14 17:44:31 · 35952 阅读 · 2 评论 -
CSS3自定义滚动条样式
写静态页面时,总会遇到 容器小内容多 的情况, 那么肯定就会用到浏览器的滚动条了。而浏览器自带的滚动条实在是太丑了,所以只好自定义滚动条样式,来满足业务需求。。。。一、首先了解滚动条的组成: ::-webkit-scrollbar 滚动条整体部分(其中的属性有width,height,background,border等) ::-webkit-scrollba...原创 2018-07-27 17:52:22 · 390 阅读 · 0 评论 -
自定义 input[type=checkbox] 样式
input[type=checkbox] 复选框作为网页中常见的一种组件, 我们在设计开发过程中,为了页面的美观,往往需要设计符合产品的风格样式;而原生的复选框样式并不美观,且直接修改它的样式,会发现只可以设置少数的样式,其余样式并没有效果。这时,我们就需要自定义checkbox的个性化样式了。 我这里简单的介绍两种CSS实现的方式:两种方式都使用表单元素中的 label 元素和for...原创 2018-08-21 14:19:51 · 17474 阅读 · 0 评论 -
自定义 input[type=radio] 样式
input[type=radio] 原生的单选框样式和原生的复选框样式是一样的不美观,而通常设计过程中,为了契合产品风格,也会将这些组件样式设计的很漂亮,但是直接修改原生的样式,会发现只可以设置少数的样式,其余样式并没有效果。因此,我们就需要自定义 radio 的个性化样式 ,来契合产品的漂亮风格了。我这里简单的介绍两种CSS实现的方式:两种方式都使用表单元素中的 label 元素和f...原创 2018-08-21 16:27:20 · 7547 阅读 · 0 评论 -
使用css伪元素,模拟html中的title属性
在html中, title属性的作用是显示额外的信息,当鼠标移动到元素上时,这些提示信息就会显示出来。然后,title属性的缺点也很明显,一是原始样式太丑,一是鼠标移动到元素上之后,需要等待一段时间才会显示;因此,我们可以使用伪类来解决这两个问题。实现步骤:一、首先html布局<div title="使用css伪类模拟title属性">title属性</div>...原创 2018-11-17 18:27:08 · 9952 阅读 · 0 评论