
  
.text-blocks {  
    display: flex;  
    flex-wrap: wrap;  
    justify-content: center;  
	margin-top: 600px;
}  
  
.text-block {  
    width: 30%;  
    height: 200px;  
    margin: 10px;  
    background-color: rgba(50, 50, 50, 0.9); /* 深灰半透明 */  
    color: white;  
    transition: background-color 0.3s ease;  
    display: flex;  
    flex-direction: column;  
    justify-content: space-between; /* 垂直居中内容（如果需要的话）*/  
    padding: 20px;  
    box-sizing: border-box;  
}  
  
.text-block:hover {  
    background-color: rgba(235, 126, 35, 0.9); /* 橙色半透明 */  
}  
  
  p + p {  
    margin-top: 1px; /* 只影响紧跟在另一个<p>标签后的<p>标签 */  
}
 .background-div {  
        /* 设置div的宽度和高度，以便可以看到背景图片 */  
        width: 100%;  

          
        /* 设置背景图片 */  
        background-image: url('{content:ext_ldt}');  
          
        /* 其他可选的样式设置 */  
        background-repeat: no-repeat; /* 不重复背景图片 */  
        background-size: cover; /* 缩放背景图片以完全覆盖div元素 */  
        background-position: center; /* 将背景图片居中放置 */  
    }  
/* 响应式布局：当屏幕宽度小于某个值时，将文字块堆叠显示 */  
@media screen and (max-width: 1710px) { /* 560px * 3 + 2 * 10px (margin) = 1710px */  
    .text-blocks {  
        flex-direction: column;  
    }  
  
    .text-block {  
        width: calc(100% - 20px); /* 减去左右padding */  
    }  
}