| | |
| | | |
| | | .cns { |
| | | border: 1px solid #5FB878; |
| | | height: 140px; |
| | | height: 160px; |
| | | border-radius: 5px; |
| | | } |
| | | |
| | | /* 修改 .cns 卡片样式 */ |
| | | /*.cns { |
| | | border: 1px solid #5FB878; |
| | | min-height: 160px;*/ /* 最小高度 */ |
| | | /*height: auto;*/ /* 高度自适应 */ |
| | | /*border-radius: 5px; |
| | | overflow: visible;*/ /* 允许内容超出,但卡片会扩展 */ |
| | | /*padding-bottom: 10px;*/ /* 添加内边距 */ |
| | | /*}*/ |
| | | |
| | | .topright dt img { |
| | | display: block; |
| | |
| | | |
| | | .topright > dd { |
| | | padding: 0px 10px; |
| | | width: 50%; |
| | | width: 75%; |
| | | } |
| | | |
| | | dt, dd { |
| | |
| | | text-overflow: ellipsis; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | /* 原来的样式 - 需要修改 */ |
| | | h1 span { |
| | | font-family: "微软雅黑"; |
| | | font-weight: bold; |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | white-space: nowrap; 这行导致不换行 |
| | | overflow: hidden; 这行导致超出隐藏 |
| | | text-overflow: ellipsis; |
| | | line-height: 0.9; |
| | | font-size:12px; |
| | | font-size: 12px; |
| | | } |
| | | |
| | | /* 修改后的样式 - 允许换行 */ |
| | | /*h1 span { |
| | | font-family: "微软雅黑"; |
| | | font-weight: bold;*/ |
| | | /* 移除 white-space: nowrap; */ |
| | | /*white-space: normal;*/ /* 改为 normal 允许换行 */ |
| | | /*word-wrap: break-word;*/ /* 允许长单词换行 */ |
| | | /*word-break: break-all;*/ /* 中文和英文都换行 */ |
| | | /*line-height: 1.2;*/ /* 增加行高,换行后更美观 */ |
| | | /*font-size: 12px; |
| | | }*/ |
| | | |
| | | .cnt, .cns dl dd { |
| | | margin: 0 auto; |
| | |
| | | .layui-show { |
| | | padding: 5px 10px; |
| | | } |
| | | |
| | | /*黄色*/ |
| | | .color_border1 { |
| | | border: 0.4em solid #ffd800; |
| | | background-color: #ffd800; |
| | | } |
| | | |
| | | /*蓝色*/ |
| | | .color_border2 { |
| | | border: 0.4em solid #09d1ea; |
| | | background-color: #09d1ea; |
| | | } |
| | | |
| | | .color_border3 { |
| | | /*灰色*/ |
| | | .color_border3 { |
| | | border: 0.4em solid #808080; |
| | | background-color: #808080; |
| | | } |
| | | /*绿色*/ |
| | | .color_border4 { |
| | | border: 0.4em solid #13ad4c; |
| | | background-color: #13ad4c; |
| | | } |
| | | |
| | | /*红色*/ |
| | | .color_border5 { |
| | | border: 0.4em solid #E74C3C; |
| | | background-color: #E74C3C; |
| | | } |
| | | /*浅绿色*/ |
| | | .color_border6 { |
| | | border: 0.4em solid #B0C4DE; |
| | | background-color: #B0C4DE; |
| | | } |
| | | /*青色*/ |
| | | .color_border7 { |
| | | border: 0.4em solid #B0C4DE; |
| | | background-color: #00FFFF; |
| | | } |
| | | .gj_icon { |
| | | border-radius: 0.4em; |
| | | width: 1px; |
| | |
| | | float: left; |
| | | top: 6px; |
| | | } |
| | | |
| | | /* 资源绑定区域的容器样式 */ |
| | | .cnt1 { |
| | | border: 1px solid #5FB878; |
| | | height: 60px; |
| | | border-radius: 5px; |
| | | position: relative; /* 添加相对定位 */ |
| | | } |
| | | |
| | | /* 添加按钮(+)样式 */ |
| | | .imgicon0 { |
| | | height: 100px; |
| | | display: block; |
| | | text-align: center; |
| | | margin: 0.2em auto; |
| | | width: 100px; |
| | | cursor: pointer; /* 鼠标变成手指样式 */ |
| | | } |
| | | |
| | | /* 针对华舟组织的特殊样式 */ |
| | | .cnt1 .imgicon0 { |
| | | /* 调整位置和大小以适应60px高度的容器 */ |
| | | font-size: 40px; /* 减小图标大小 */ |
| | | height: 60px; /* 调整高度 */ |
| | | width: 60px; /* 调整宽度 */ |
| | | line-height: 60px; /* 垂直居中 */ |
| | | margin: 0 auto; /* 水平居中 */ |
| | | } |
| | | |
| | | /* 其他组织的样式 */ |
| | | .cnt .imgicon0 { |
| | | /* 150px高度容器的样式 */ |
| | | font-size: 60px; |
| | | height: 150px; |
| | | width: 150px; |
| | | line-height: 150px; |
| | | margin: 0 auto; |
| | | } |
| | | |
| | | .imgicon0:hover { |
| | | cursor: pointer; /*鼠标变成手指样式*/ |
| | | -webkit-transition: border linear .1s, -webkit-box-shadow linear .5s; |
| | | border-color: rgba(141, 39, 142, .75); |
| | | -webkit-box-shadow: 0 0 18px rgba(111, 1, 32, 3); |
| | | color: #5FB878; /* 悬停时改变颜色 */ |
| | | transform: scale(1.1); /* 悬停时轻微放大 */ |
| | | transition: all 0.3s ease; /* 平滑过渡效果 */ |
| | | } |
| | | |
| | | /* 可以添加一个专门的加号按钮样式类 */ |
| | | .add-icon-container { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .add-icon-container .layui-icon-addition { |
| | | font-size: 40px; |
| | | color: #5FB878; |
| | | } |
| | | |
| | | .add-icon-container:hover .layui-icon-addition { |
| | | color: #13ad4c; |
| | | transform: rotate(90deg); /* 悬停时旋转效果 */ |
| | | transition: all 0.3s ease; |
| | | } |