css标签显示模式 css背景

CSS中设置元素的显示模式和背景可以通过直接在元素的选择器中添加样式规则来实现。以下是一些基本的例子：

/* 设置元素的显示模式为块级元素 */
.block-element {
  display: block;
}
 
/* 设置元素的显示模式为内联元素 */
.inline-element {
  display: inline;
}
 
/* 设置元素的显示模式为内联块级元素 */
.inline-block-element {
  display: inline-block;
}
 
/* 设置元素的背景色 */
.element-with-background {
  background-color: #f0f0f0;
}
 
/* 设置元素的背景图片 */
.element-with-background-image {
  background-image: url('path/to/image.jpg');
  background-size: cover; /* 覆盖整个元素 */
  background-repeat: no-repeat; /* 不重复背景图片 */
}

在HTML中使用这些类：

<div class="block-element">这是一个块级元素</div>
<span class="inline-element">这是一个内联元素</span>
<div class="inline-block-element">这是一个内联块级元素</div>
<div class="element-with-background">有背景色的元素</div>
<div class="element-with-background-image">有背景图片的元素</div>

这些例子展示了如何使用CSS来改变元素的显示模式和添加背景样式。