css3怎么让字体不换行
css3怎么让字体不换行在css中，可以使用white-space属性来强制文字不换行；通常我们使用white-space:nowrap来强制文本文字内容不换行，文本会在在同一行上显示，直到遇到 <br> 标签...
2022-03-29
css3只能实现一次动画吗
css3只能实现一次动画吗css3不是只能实现一次动画。利用animation-iteration-count即可。animation-iteration-count属性定义动画应该播放多少次。默认值为一。语法animatio...
2022-03-29
css3有判断语句吗
css3有判断语句吗css3中有判断语句。@supports是CSS3新引入的规则之一，主要用于检测当前浏览器是否支持某个CSS属性并加载具体样式，即css的特性检测。CSS特性检测就是针对不同...
2022-03-29
css3怎么去掉input点击的框
css3怎么去掉input点击的框1、可以先利用:focus选择器选中input元素:focus选择器用于选择具有焦点的元素。:focus选择器接受键盘事件或其他用户输入的元素。2、再利用outlin...
2022-03-29
css3怎么实现动画结束不消失效果
css3怎么实现动画结束不消失效果animation-fill-mode 属性规定当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。默认情况下，CSS 动画在第一个...
2022-03-29
CSS3中的渐变分为哪几类
CSS3中的渐变分为哪几类CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。 线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向 径向渐变（R...
2022-03-29
怎么用CSS3实现对图片的放大效果
怎么用CSS3实现对图片的放大效果方法一，利用transform属性配合scale()方法transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。scal...
2022-03-29
css3支持rgba吗
css3支持rgba吗rgba() 函数使用红(R)、绿(G)、蓝(B)、透明度(A)的叠加来生成各式各样的颜色。支持版本：CSS3RGBA 即红色、绿色、蓝色、透明度（英语：Red, Green, Blue、Alpha）。C...
2022-03-29
神奇的CSS，实现自动补全字符串！
很多时候都会碰到字符串补全的需求，典型的例子就时间或者日期中的补零操作，例如2021-12-312022-03-03通常的做法是if (num < 10) { num = '0' + num}后来，JS 中出现了...
2022-03-24
使用CSS连接数据库的方式
故事背景某公司招聘需求如下:我们正在寻求可以 使用CSS连接数据库 的前端伙伴~自从我上次开始一个高质量的“发帖”以来，已经有很长一段时间了，事实上，它已经很长一...
2022-03-20
css3新特性的应用示例分析
css3 盒子模型css3 中可以通过 box-sizing 来指定盒模型，有2个值：即可指定为 content-box 、border-box ，这样我们计算盒子大小的方式就发生了改变。可以分成两种情况：box - siz...
2022-03-20
css布局技巧css三角示例的巧妙运用
目录css三角强化案例结语css三角强化上期的css三角是等腰的，有是我们需要像下面这中的直角，该怎么做呢？接下来我一步步教你做：在上期做法基础上做改动就行只需要把上期这个盒子...
2022-03-20
css3新增选择器的应用示例
目录属性选择器示例结构伪类选择器示例伪元素选择器示例结语CSS3给我们新增了选择器，可以更加便捷，更加自由的选择目标元素，你还不知道吗？属性选择器属性选择器可以根据元素特定...
2022-03-20
CSS3实现指纹特效代码
具体代码如下所示：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; box-sizing:...
2022-03-20
CSS精灵图的原理与使用方法介绍
目录I.精灵图介绍II.精灵图的实现方式：拼出你的名字III.软件辅助定位I.精灵图介绍首先，我们先介绍一下什么是精灵图：先强调一点哈，精灵图和下面这个玩意儿没啥关系：它的名字是这...
2022-03-20
css实现左上角飘带效果的完整代码
css实现左上角飘带效果效果如下：html代码<div class='wrap'> <div class='ribbon'> <span>测试1</span> </div></div>css代码.wrap { /* 最外层的div容器 */...
2022-03-20
看看图片马赛克风格化效果用CSS怎么实现？
一、image-rendering 介绍CSS 中有一个有趣的特性叫 image-rendering，它可以通过算法来更好地显示被缩放的图片。假设我们有一张尺寸较小的二维码截图（下方左，仅为示意图不可扫...
2022-02-28
你必须了解Selenium使用CSS定位总结
大部分人在使用selenium定位元素时，用的是xpath定位，css定位往往被忽略掉了，其实css定位也有它的价值，css定位更快，语法更简洁一、CSS 选择器常见符号：
#表示 id选择器
.表示 clas...
2022-02-17
快看！10个值得收藏的CSS实用小技巧
1.如何在CSS中修复网页上的水平滚动如果你在设置网页样式并且在底部看到水平滚动条，则需要找到宽度大于可用屏幕宽度的元素。例如，在下面的屏幕截图中，你可以看到有一个水平滚...
2022-02-17
鲜为人知！用css做极光效果
使用 CSS 可以实现极光吗？像是这样：emmm，这有点难为人了。不过，最近我也尝试着去试了下，虽然不可能模拟出那么真实的效果，但是使用 CSS 还是可以作出类似的一些特效的，今天我们就一...
2022-02-09
你了解 Transition 吗？一起来深入了解下Transition！
这篇文章我们深入学习 Transition 动画。没错，CSS3 Transition 动画。你可能会问，不是很简单吗，这什么好讲的？确实，Transition 动画使用起来非常容易。只需要给元素加上 transiti...
2022-02-09
CSS实现九宫格布局(自适应)的示例代码
简介 本文用示例介绍CSS进行九宫格布局的方法。 朋友圈、微博等很多社交平台都是使用九宫格布局来展示图片的，九宫格布局也是前端面试经常会问的问题。...
2022-01-24
css3怎样实现立体翻转效果
css3怎样实现立体翻转效果transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。当该属性与rotateX()、rotateY()、rotateZ()和rotat...
2022-01-24
css3圆角属性的每个值代表什么
css3圆角属性的每个值代表什么CSS3 border-radius - 指定每个圆角，border-radius 属性是一个最多可指定四个 border -*- radius 属性的复合属性如果你在 border-radius属性中...
2022-01-24
css3中border-box是什么意思
css3中border-box是什么意思在css3中border-box是box-sizing属性的一个值。box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。例如，假如您需要并排放置两个带...
2022-01-24
css3怎样设置一行显示多少个字符
css3怎样设置一行显示多少个字符overflow 属性规定当内容溢出元素框时发生的事情。这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会...
2022-01-24
css3怎样用rotate设置旋转角度
css3怎样用rotate设置旋转角度transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。该属性可以配合rotate()函数来设置旋转角度。ro...
2022-01-24
css3设置动画匀速的属性单词是哪个
css3设置动画匀速的属性单词是哪个animation-timing-function 规定动画的速度曲线。速度曲线定义动画从一套 CSS 样式变为另一套所用的时间。速度曲线用于使变化更为平滑。...
2022-01-24
值得收藏css预处理器scss的使用总结
1. 为什么会出现css预处理器–CSS不是一种编程语言，仅仅只能用来编写网站样式，在web初期时，网站的搭建还比较基础，所需要的样式往往也很简单。但是随着用户需求的增加以及...
2022-01-24
一个实例用css来实现胖橘的喜乐（实例分享）
本期我们通过vite+scss去完成一个橘猫心情变化的创意动画，这里的逻辑我们将不使用任何js代码，仅依靠css来完成，所以，通过本期的动画，你可以到一些css动画和绘制的一些技巧。还比...
2022-01-22
一文详解如何css实现动态弧形线条长短变化的Loading动画
有群友问我，使用 CSS 如何实现如下 Loading 效果：这是一个非常有意思的问题。我们知道，使用 CSS，我们可以非常轻松的实现这样一个动画效果：<div></div>div { width: 100px;...
2022-01-22
将内联元素转换为块元素的css语句是什么
根据css显示分类，HTML元素被分为 三种类型:块状元素，内联元素，内联块元素。在css中，只需要给内联元素设置display：block样式即可将其转换为块元素。display属性用于定义建立布局...
2022-01-20
css怎么降低背景透明度
css降低背景透明度方法1：使用opacity属性Opacity属性设置一个元素了透明度级别。从0.0（完全透明）到1.0（完全不透明）<!DOCTYPE html><html><head><meta charset="UTF-8"><style ty...
2022-01-20
怎么用css样式把图片改为灰色
在css中，可以利用filter属性来把图片改为灰色。filter 属性定义了元素(通常是<img>)的可视效果，即给图片添加滤镜效果，例如：模糊与饱和度。当filter 属性的值为grayscale(%)，可将...
2022-01-20
css怎样改变一个图片高度和宽度
在css中，可以使用width和height属性来改变一个图片高度和宽度。width属性可设置元素的宽度，height属性可设置元素的高度。示例：<!DOCTYPE html><html> <head> <style> .img1...
2022-01-20
css怎么实现图片放大缩小动画
在css中，可以使用animation属性、“@keyframes”规则、transform: scale()实现图片放大缩小动画。示例1：<div class="ballon"></div>/*css部分*/ @keyframes scal...
2022-01-20
css怎么实现鼠标移上去旋转效果
css实现鼠标移上去旋转效果 旋转效果可以利用animation属性和“@keyframes”规则创建动画实现。 而鼠标移上元素，触发旋转动画需要使用:hover选择器。（:hover 选...
2022-01-20
css3如何让animation动画停止
在css3中，可用animation-play-state属性来让运行的animation动画停止。例如：有这么一个不断旋转的动画：<!DOCTYPE html><html> <head> <style> div { width: 100px; h...
2022-01-20
css3球体怎么实现
css3实现球体的步骤：1、基本形状我们先来实现一个基本的圆，HTML 代码如下：<figure class="circle"></figure> 这里使用的是 HTML5 新增标签 figure，也可以用其它标签。figure...
2022-01-20
css怎么调整中文字间距
在css中，可以利用letter-spacing属性来调整中文字间距。letter-spacing属性可增加或减少字符间的空白，即设置字符间距。letter-spacing属性定义了在文本字符框之间插入多少空...
2022-01-20
css图片的边框怎么设置颜色为渐变色
在css中，可以利用border-image属性和linear-gradient()函数来将图片边框的颜色设置为渐变色 border-image属性用于设置图片边框 linear-gradient()函数用于实现线性渐变实...
2022-01-20
css中段落边框如何设置
css设置段落边框1、使用border属性<!DOCTYPE html><html> <head> <style type="text/css"> p{ padding: 10px; border: 1px solid red; } </style> </head> <bo...
2022-01-20
怎样给select添加css样式
html中给select添加css样式 给select标签添加id或class属性并设置属性值 在style标签对中，使用id或class选择器选中select元素并设置样式实现代码：<!DOCTYPE html><html> <h...
2022-01-20
手把手教你CSS架构之SMACSS
因为 CSS 只有一个作用域，如果不注意维护 CSS 代码，则会导致我们写的代码难于阅读和维护，于是我们借助网页本身是有层次的，抽象出来了BEM 方法论。BEM 简单的三层分法，在应对小中...
2022-01-20
css3如何让盒子水平居中
在CSS中如何让盒子水平居中是很常见的面试题，盒子居中是相对于父元素来说的，因此我们让盒子居中时，往往采用嵌套的方式，让父盒子套着子盒子 。在父子盒子嵌套下，让子盒子居中的方...
2022-01-20
css怎么设置按钮中的字大小
在css中更改按钮中字体大小的方法1、首先，在页面中创建两个按钮，并定义class类用于对比； <body> <button type="button" class="btn">字体为20px</button> <button type="b...
2022-01-20
手把手教你使用CSS制作动态饼图（附代码）
饼图是常见的组件，可让你显示整体的各个部分，你可以将它们用于许多不同的场景。 你会发现很多关于构建这样一个组件的文章，但它们通常要么依赖于 SVG，要么依赖于大量的 HTML 元...
2022-01-20
css3实现动画的好处有哪些
css3动画的属性总的来说只有transform(变形)，transition(过渡)，和animation(动画)这三种。transition:1s(过渡的动画效果)：从一个人具体的值到另一个过渡的值transform:rotate(...
2022-01-13
