cSS3主题的文章列表，还有cSS3的技术要点_第14页

CSS3字体大小rem属性用法

PX为单位在Web页面初期制作中，我们都是使用“px”来设置我们的文本，因为他比较精确和固定。只要页面某元素设置了px字体大小，其子元素/子孙元素未设置字体大小或设置的字体大小css优先级没父元素高的话，该子元素/子孙元素会继承其父元素的px字体大小设置。这种方法存在一个问题：当用户...

代码星球 ·2020-11-01

css3之水波效果

这些效果可谓多种多样，当然用canvas、svg也都能实现奈何对这些有不熟悉（尴尬），不过咱们用css来写貌似也没想象中的那么难吧。效果图 css.container{width:100px;height:100px;border-radius:50%;border:3pxsolid#e787e7...

代码星球 ·2020-09-17

CSS3中的px,em,rem,vh,vw

1、px：像素，精确显示2、em：继承父类字体的大小，相当于“倍”，如：浏览器默认字体大小为16px=1em，始终按照div继承来的字体大小显示，进场用于移动端 em换算工具：http://www.runoob.com/tags/ref-...

代码星球 ·2020-09-17

CSS3伪类和伪元素的特性和区别

前端er们大都或多或少地接触过CSS伪类和伪元素，比如最常见的:focus,:hover以及<a>标签的:link、visited等，伪元素较常见的比如:before、:after等。其实上面提到的这些伪类和伪元素都是CSS1和CSS2中的概念，CSS1和CSS2中对伪类的伪元素的区别比较模糊，甚至经常有同...

代码星球 ·2020-09-13

浅谈css3有意思的属性pointer-events: none；

可以用来阻止事件pointer-events:none；可以让某个元素实现类似于海市蜃楼的效果，具体理解为，你可以看的到某个元素，但是你无法摸的着。而display：none;是你摸不着，但是你也看不见。 pointer-events:none；摸不着，但是看得见。如果把某个元素再加上...

代码星球 ·2020-09-13

css3图形绘制

以下几个例子主要是运用了css3中border、bordr-radius、transform、伪元素等属性来完成的，我们先了解下它们的基本原理。 border：简单的来说border语法主要包含（border-width、border-style、border-color）...

代码星球 ·2020-09-12

DIV右上角标签的CSS3实现技巧

CSScode:--双倍攒豆<spanclass="aliPointView">双倍攒豆<spanclass="aliPointstrikethrough">194欢豆&l...

代码星球 ·2020-09-08

纯css3响应式3d翻转菜单

前端开发whqet,csdn,王海庆,whqet,前端开发专家周末快乐哈，今天来看一个纯CSS3实现的3d翻转菜单。3d响应式菜单，希望对大家有所帮助。在线赞赏效果。在线编辑代码，或者下载收藏。html文件例如以下<ulclass="menu"><li><atitle=...

代码星球 ·2020-08-28

CSS3设置内容超过一定长度后自动折行

在用编辑器保存的数据到数据库的时候经常是在我们的内容前后加一个P标签，但是出来之后是一行，有时候会超过边框的宽度，所以研究了如何折行,如下代码:<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title>...

代码星球 ·2020-08-27

CSS3动画(重要)

CSS3，我们可以创建动画，它可以取代许多网页动画图像，Flash动画，和JAVAScripts。要创建CSS3动画，你将不得不了解@keyframes规则。@keyframes规则是创建动画。@keyframes规则内指定一个CSS样式和动画将逐步从目前的样式更改为新的样式。实例:@keyframesmyfirst{...

代码星球 ·2020-08-26

CSS3 过渡

CSS3中，我们为了添加某种效果可以从一种样式转变到另一个的时候，无需使用Flash动画或JavaScript. CSS3过渡是元素从一种样式逐渐改变为另一种的效果。要实现这一点，必须规定两项内容：指定要添加效果的CSS属性指定效果的持续时间。应用于宽度属性的过渡效果，时长为2秒：div{transition...

代码星球 ·2020-08-26

CSS3 3D 转换

CSS3允许您使用3D转换来对元素进行格式化。在本章中，您将学到其中的一些3D转换方法：rotateX()rotateY()rotateX()方法，围绕其在一个给定度数X轴旋转的元素div{width:100px;height:75px;background-color:red;border:1pxsolidblack...

代码星球 ·2020-08-26

CSS3 2D 转换

CSS3转换，我们可以移动，比例化，反过来，旋转，和拉伸元素。在本章您将了解2D变换方法：translate()rotate()scale()skew()matrix()<!DOCTYPEhtml><html><head><metacharset="ut...

代码星球 ·2020-08-26

CSS3 文本效果(阴影)

CSS3中包含几个新的文本特征。在本章中您将了解以下文本属性：text-shadowbox-shadowtext-overflowword-wrapword-break CSS3中，text-shadow属性适用于文本阴影。您指定了水平阴影，垂直阴影，模糊的距离，以及阴影的颜色：<style>h1...

代码星球 ·2020-08-26

CSS3 渐变（Gradients）

参考:http://www.runoob.com/css3/css3-gradients.html CSS3渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前，你必须使用图像来实现这些效果。但是，通过使用CSS3渐变（gradients），你可以减少下载的事件和宽带的使用。此外，...

代码星球 ·2020-08-26