1K+ 次浏览
CSS 中的相对长度单位用于指定相对于另一个长度属性的长度。让我们看看 CSS 中的一些关键单位及其描述 - 序号 单位 & 描述 1 em相对于元素的字体大小,即 4em 表示当前字体大小的 4 倍。 2 ex相对于当前字体的 x 高度 3 ch相对于 0 的宽度 4 rem相对于根元素的字体大小 5 vw相对于视口宽度的 1%* 6 ... 阅读更多
131 次浏览
要设置列规则,可以使用 column-rule 简写属性,它允许您设置以下属性 - column-rule-width:设置列之间规则的宽度 column-rule-style:设置列之间规则的样式 column-rule-color:设置列之间规则的颜色 列规则的值可以设置为 - column-rule:column-rule-width column-rule-style column-rule-color|initial|inherit; column-rule:column-rule-width column-rule-style column-rule-color|initial|inherit; 此外,这些属性可以单独使用。我们将看到这两个示例。Column-rule 简写属性 在此示例中,我们使用简写属性设置了 column-rule - column-rule: ... 阅读更多
80 次浏览
背景位置用于设置背景图像的起始位置。为此,请使用 background-position 属性。示例现在让我们来看一个示例 - 实时演示 body { background-image: url("https://tutorialspoint.com/images/Swift.png"); background-repeat: no-repeat; background-attachment: fixed; color: blue; background-position: left center; } .demo { text-decoration: overline underline; } 详细信息 ABC 学院附近的考试中心。考试于上午 9 点开始。输出示例现在让我们来看另一个示例 - 实时演示 body { background-image: url("https://tutorialspoint.com/images/Swift.png"); background-repeat: no-repeat; background-attachment: fixed; color: blue; background-position: 50% 50%; } 详细信息 ABC 学院附近的考试中心。考试于上午 9 点开始。输出
162 次浏览
要使用 CSS 设置背景颜色,请使用 background-color 属性。示例现在让我们来看一个示例 - 实时演示 .demo { text-decoration: overline underline; background-color: red; } 详细信息 ABC 学院附近的考试中心。考试于上午 9 点开始。输出示例现在让我们来看另一个示例 - 实时演示 .demo { text-decoration: overline underline; } 详细信息 ABC 学院附近的考试中心。考试于上午 9 点开始。输出
273 次浏览
使用相对定位,元素相对于其正常位置进行定位。为此,请使用 position: relative 示例现在让我们来看一个示例 - 实时演示 div.demo { position: relative; color: white; background-color: orange; border: 2px dashed blue; left: 50px; } 演示标题 这是演示文本。这是演示文本。position: relative; 这是另一段演示文本。输出
165 次浏览
使用静态定位,元素不受 top、bottom、left 和 right 属性的影响。为此,请使用 position: static。示例现在让我们来看一个示例 - 实时演示 div.static { position: static; color: white; background-color: orange; border: 2px dashed blue; } 演示标题 这是演示文本。这是演示文本。position: static; 这是另一段演示文本。输出
96 次浏览
要设置行高,请使用 line-height 属性。以下是属性值 -line-height:normal|number|length|initial|inherit;示例现在让我们来看一个示例 - 实时演示 div { line-height: 1.9; } 演示标题 这是演示文本。这是另一段演示文本。输出示例现在让我们来看另一个示例 - 实时演示 div { line-height: 200%; } 演示标题 这是演示文本。这是另一段演示文本。输出
257 次浏览
字体、高度、宽度、边距、填充等都使用长度单位在网页上设置。例如,高度 100px、宽度 100px、字体 2em 等。这些长度单位分为绝对单位和相对单位。CSS 绝对单位 绝对长度单位彼此之间是固定的。当输出格式已知时,使用这些单位。以下是其中一些绝对长度单位 - 序号 单位 & 描述 1 cm厘米 2 mm毫米 3 英寸英寸(1 英寸 = 96 像素 = 2.54 厘米) 4 px *像素(1 像素 ... 阅读更多
203 次浏览
CSS 中的 translate() 函数用于在水平和垂直方向上重新定位元素。如果要沿 X 轴和 Y 轴从当前位置移动元素,请使用 translate() 函数。语法语法如下 - Transform:translate(x, y) 上面,变换元素以及 x 轴和 y 轴。平移图像在此示例中,我们将使用 translate() 方法平移即移动图像。使用 transform 属性设置它 - .translate_img { transform: translate(50px, 20px); } 示例现在让我们看 ... 阅读更多
158 次浏览
列表是有序的,也是无序的。使用 CSS,您可以设置列表项标记集或标记的图像。除此之外,使用 CSS,我们还可以设置列表项标记的位置。现在让我们来看一些示例 -list-style-type list-style-type 用于设置列表项标记的类型。示例现在让我们来看一个示例,其中我们正在格式化有序列表 (ol) - 实时演示 ul { list-style-type: upper-roman; } 团队 印度 澳大利亚 英国 西印度群岛 南非 斯里兰卡 输出list-style-image list-style-image 属性用于将图像设置为 ... 阅读更多