📅  最后修改于: 2020-11-05 05:38:59        🧑  作者: Mango

CSS伪元素伪类可以定义为关键字，该关键字将与选择器结合在一起，该选择器定义所选元素的特殊状态。与伪类不同，伪元素用于设置元素的特定部分的样式，而伪类用于设置元素的样式。例如，伪元素可用于为元素的第一个字母或第一行设置样式。伪元素还可以用于在元素之后或元素之前插入内容。句法伪元素具有以下简单语法：我们在语法中使用了双冒号(:: pseudo-element)。在CSS3中，双冒号代替了伪元素的单冒...

📅  最后修改于: 2020-11-05 05:39:57        🧑  作者: Mango

CSSradial-gradient()函数radial-gradient()是内置的CSS函数，可在两种或两种以上的颜色之间生成平滑过渡。它将径向渐变设置为背景图像。它可以是圆形或椭圆形。它可以节省带宽使用量，并有助于减少下载时间。在径向渐变中，颜色从单个点出现，然后向外扩散。径向渐变由其中心点和结束形状以及两个或两个以上的色标定义。句法让我们讨论其论点。position：定义渐变位置。其默认值...

📅  最后修改于: 2020-11-05 05:40:51        🧑  作者: Mango

CSS translate()函数translate()函数是CSS的内置函数，用于在垂直或水平方向上重新定位元素。它根据给定的参数从当前方向移动元素。句法参数ty是可选的。如果未指定，则假定其值为零。现在，我们将详细讨论每个参数。参量tx：此参数定义沿x轴的平移长度。它代表翻译向量的横坐标(水平，x坐标)。如果我们编写translate(4)，那么它将等同于translate(4,0)。ty：定...

📅  最后修改于: 2020-11-05 05:41:51        🧑  作者: Mango

CSS 渐变CSS渐变用于显示两种或多种指定颜色的平滑过渡。为什么使用CSS渐变这些是使用CSS渐变的以下原因。您不必使用图像来显示过渡效果。下载时间和带宽使用量也可以减少。缩放时，它可以为元素提供更好的外观，因为渐变是由浏览器生成的。CSS3中有两种类型的渐变。线性渐变径向渐变1)CSS线性渐变CSS3线性渐变向上/向下/向左/向右倾斜。要创建CSS3线性渐变，必须定义两个或多个色标。色标是用于...

📅  最后修改于: 2020-11-05 05:42:46        🧑  作者: Mango

CSS Z索引CSS中的z索引使我们能够在3维平面(即z轴)上定义视觉层次。它用于指定定位元素(位置值是固定，绝对，相对或粘性的元素)的堆叠顺序。堆叠顺序是指元素沿垂直于屏幕的z轴的位置。如果元素彼此重叠，则定义元素的顺序。句法属性值number：表示元素的堆栈级别设置为给定值。它允许负值。auto：这意味着堆栈的顺序与父顺序相同，即默认顺序。让我们通过插图来了解它。例...

📅  最后修改于: 2020-11-05 05:43:38        🧑  作者: Mango

CSS minifyminify CSS文件意味着从源代码中消除不必要的字符以减小文件的大小。缩小的主要目的是提高网站的速度。当任何用户在网页上请求时，将发送缩小版本，而不是发送完整版本。这样可以降低带宽成本，并缩短响应时间。它有助于使站点可访问并提高搜索引擎的排名。最小化包括删除不必要的字符，例如换行符，空格，块定界符和注释。缩小的CSS文件以扩展名’.min.css’结尾。缩小不同于压缩。压缩...

📅  最后修改于: 2020-11-05 05:44:34        🧑  作者: Mango

CSS loader(加载器)加载程序是指可以使访问者警惕页面正在加载的任何动画，您必须等待几秒钟。当页面花费几秒钟来加载网页内容时，这将很有帮助。如果不使用网页上的加载程序，访问者可能会认为该站点没有响应。使用CSS加载程序会使访问者分心或等待一段时间，直到页面完全加载为止。通过使用以下插图，我们可以了解CSS loader的概念。例1让我们看一下要在其中创建微调器的加载器的另一个示例。例2在上...

📅  最后修改于: 2020-11-05 05:45:34        🧑  作者: Mango

CSS unitsCSS中有各种单位来表示尺寸和长度。 CSS单位用于确定属性大小，我们为元素或其内容设置了大小。 CSS中的单位需要定义度量，例如margin：20px;其中px(或像素)是CSS单位。它们用于设置页边距，填充，长度等。我们不能在数字和单位之间应用空格。值0可以省略单位。CSS的某些属性允许使用负值length。CSS中的长度单位有两种：绝对长度。相对长度。绝对长度这些是固定长度...

📅  最后修改于: 2020-11-05 05:46:35        🧑  作者: Mango

CSS css-combinatorsCSS组合器阐明了两个选择器之间的关系，而CSS中的选择器用于选择样式内容。CSS选择器中可以有多个简单选择器，在这些选择器之间，我们可以包含一个组合器。组合器将选择器组合在一起，为它们提供有用的关系以及内容在文档中的位置。CSS中有四种组合器，如下所示：General sibling selector (~)Adjacent sibling selector...

📅  最后修改于: 2020-11-05 05:47:30        🧑  作者: Mango

CSS mask属性CSS中的mask属性用于在特定点处使用剪辑或遮罩图像来隐藏元素。遮罩定义如何使用图像或图形元素作为亮度或Alpha遮罩。它是一种图形操作，可以完全或部分隐藏元素或对象的各个部分。使用遮罩，可以显示或隐藏具有不同不透明度级别的图像部分。在CSS中，遮罩是通过使用mask-image属性来实现的，我们必须提供图像作为遮罩。让我们用一些插图来了解它。例在此示例中，我们在图像元素上放...

📅  最后修改于: 2020-11-05 05:48:24        🧑  作者: Mango

CSS transition属性CSS transition是添加的效果，用于在不使用Flash或JavaScript的情况下将元素从一种样式逐渐更改为另一种样式。您应该指定两件事来创建CSS transition要在其上添加效果的CSS属性。效果的持续时间。让我们来看一个示例，该示例定义对width属性和3秒持续时间的transition效果。注意：如果未指定持续时间部分，则transition...

📅  最后修改于: 2020-11-05 05:49:21        🧑  作者: Mango

CSS工具提示当用户将鼠标光标移到某个元素上时，CSS工具提示是一种显示有关某事的额外信息的好方法。基本工具提示示例让我们创建一个基本的工具提示，当鼠标光标移到某个元素上时显示。请参阅以下示例：通过使用工具提示，可以通过四种方式显示工具提示信息的位置：元素的顶部元素的左侧元素的右侧元素的底部热门工具提示顶部工具提示指定，如果将鼠标光标移到元素上方，则工具提示信息将显示在元素顶部。请参阅以下示例：底...

📅  最后修改于: 2020-11-05 05:50:13        🧑  作者: Mango

CSS Tooltip动画提示工具提示文本中的CSS淡入或工具提示动画用于在将其变为可见时淡入工具提示文本。 CSS3的“ transition”属性和“ opacity”属性一起用于在工具提示或工具提示动画中淡入淡出。从完全不可见到100％可见的动画时间以秒为单位指定。让我们以一个示例来演示CSS工具提示动画。在此示例中，淡入时间为5秒。请参阅以下示例：...

📅  最后修改于: 2020-11-05 05:51:11        🧑  作者: Mango

CSS arrow箭头CSS箭头用于与工具提示一起添加数组。它使工具提示像气泡一样。它也可以用四种方式表示：Top arrowBottom arrowLeft arrowRight arrowCSS上箭头当您将鼠标光标移到元素上方时，顶部箭头用于在工具提示的顶部添加类似箭头的结构。它将在元素底部显示工具提示。请参阅以下示例：CSS底部箭头当您将鼠标光标移到元素上方时，底部箭头用于在工具提示的底部添...

📅  最后修改于: 2020-11-05 05:52:07        🧑  作者: Mango

CSS FlexboxCSS3柔性框也称为CSS Flexbox，是CSS3中的一种新的布局模式。CSS3 flexbox用于使元素在不同屏幕尺寸和不同显示设备上使用时具有可预测的行为。它提供了一种更有效的方式来布局，对齐和分配容器中各个项目之间的空间。它主要用于使CSS3能够更改其项目的宽度和高度，以最适合所有可用空间。它优于块模型。CSS3 flexbox包含flex容器和flex项目。Fle...