diff --git a/ruoyi-admin/src/main/resources/templates/manage/service/service.html b/ruoyi-admin/src/main/resources/templates/manage/service/service.html index 6c81a4a7..7e7f2dfa 100644 --- a/ruoyi-admin/src/main/resources/templates/manage/service/service.html +++ b/ruoyi-admin/src/main/resources/templates/manage/service/service.html @@ -90,6 +90,49 @@ width: 80px; text-align: center; } + @media (max-width: 768px) { + .tableBOx { + width: 100%; + } + + .container,.topBox{ + display: none; + } + .table-striped thead { + display: none; /* 隐藏表头 */ + } + + .table-striped tbody tr { + display: flex; + flex-direction: column; + border-bottom: 1px solid #ddd; + margin-bottom: 10px; + } + + .table-striped tbody td { + display: flex; + justify-content: space-between; + align-items: center; + padding: 8px 10px; + border-bottom: 1px solid #eee; + } + + /*.table-striped tbody tr td:first-child {*/ + /* font-weight: bold;*/ + /* min-width: 100px;*/ + /* max-width: 120px;*/ + /*}*/ + + /* 新增样式:为每个 td 添加伪元素来显示表头 */ + .table-striped tbody tr td::before { + content: attr(data-th); /* 使用 data-th 属性来显示表头 */ + font-weight: bold; + display: inline-block; + min-width: 100px; + max-width: 100px; + margin-right: 10px; + } + }
@@ -101,7 +144,7 @@