模板:Imm/test.css:修订间差异
来自RIA | Wiki
更多操作
无编辑摘要 |
无编辑摘要 |
||
| 第1行: | 第1行: | ||
@charset "utf-8"; | |||
/* CSS Document */ | |||
.main { | |||
} | |||
.leftbox { | .leftbox { | ||
display: block; | display: block; | ||
| 第16行: | 第21行: | ||
.leftbox-body { | .leftbox-body { | ||
margin: | margin: 0; | ||
padding: 1em; | padding-right: 1em; | ||
padding-left: 1em; | |||
padding-bottom: 1em; | |||
display: block; | display: block; | ||
} | } | ||
.leftbox-body-text { | .leftbox-body-text { | ||
display: flex; | |||
align-items: center; | align-items: center; | ||
} | } | ||
| 第37行: | 第44行: | ||
border: solid black 1px; | border: solid black 1px; | ||
margin-bottom: 20px; | margin-bottom: 20px; | ||
width: 350px; | max-width: 350px; | ||
min-width: auto; | min-width: auto; | ||
flex-flow: wrap; | flex-flow: wrap; | ||
flex-direction: row; | flex-direction: row; | ||
width: 350px; | |||
float: right; | |||
margin-left: 10px; | margin-left: 10px; | ||
| 第104行: | 第113行: | ||
flex-direction: column; | flex-direction: column; | ||
width: 350px; | width: 350px; | ||
float: | float: left; | ||
} | } | ||
| 第114行: | 第123行: | ||
box-sizing: border-box; | box-sizing: border-box; | ||
min-width: 320px; | min-width: 320px; | ||
} | |||
.landmark { | |||
margin-top: 12px; | |||
margin-right: 12px; | |||
margin-bottom: 12px; | |||
margin-left: 12px; | |||
border-top: 1px solid #FFD3C7; | |||
border-bottom: 1px none #FFD3C7; | |||
display: flex; | |||
flex-flow: wrap; | |||
flex-direction: row; | |||
} | |||
.landmark-new { | |||
width: 123px; | |||
border-right-color: #FFD3C7; | |||
margin-top: 5px; | |||
margin-bottom: 5px; | |||
margin-left: 10px; | |||
} | |||
.landmark-new-br { | |||
width: 20px; | |||
border-right-color: #FFD3C7; | |||
float: left; | |||
} | |||
.landmark-new-img { | |||
width: 100px; | |||
border-right-color: #FFD3C7; | |||
float: right; | |||
margin-top: 7px; | |||
text-align: center; | |||
margin-right: 1px; | |||
} | |||
.landmark-recommend { | |||
border-width: 5px 1px 5px 5px; | |||
width: auto; | |||
border-right-color: #FFD3C7; | |||
margin-top: 5px; | |||
margin-bottom: 5px; | |||
margin-left: 21px; | |||
padding-left: 1px; | |||
} | |||
.landmark-recommend-br { | |||
width: 20px; | |||
border-right-color: #FFD3C7; | |||
} | |||
.landmark-recommend-img { | |||
width: auto; | |||
margin-top: -83px; | |||
text-align: center; | |||
margin-right: 1px; | |||
display: flex; | |||
flex-flow: wrap; | |||
flex-direction: row; | |||
margin-left: 14px; | |||
padding-left: 0px; | |||
} | |||
.landmark-recommend-img-unit { | |||
border-width: 5px 1px 5px 5px; | |||
width: 100px; | |||
border-right-color: #FFD3C7; | |||
float: right; | |||
margin-top: 7px; | |||
text-align: center; | |||
margin-right: 1px; | |||
margin-left: 10px; | |||
} | } | ||
2023年5月2日 (二) 00:32的版本
@charset "utf-8";
/* CSS Document */
.main {
}
.leftbox {
display: block;
border: solid black 1px;
margin-bottom: 20px;
width: auto;
min-width: 350px;
margin-left: 10px;
margin-right: 10px;
}
.leftbox-header {
display: block;
background-color: #ffd3c7;
color: #ffffff;
}
.leftbox-body {
margin: 0;
padding-right: 1em;
padding-left: 1em;
padding-bottom: 1em;
display: block;
}
.leftbox-body-text {
display: flex;
align-items: center;
}
.leftbox-header h2 {
text-align: left;
margin: 0;
padding: 0.3em;
display: block;
}
.rightbox {
display: block;
border: solid black 1px;
margin-bottom: 20px;
max-width: 350px;
min-width: auto;
flex-flow: wrap;
flex-direction: row;
width: 350px;
float: right;
margin-left: 10px;
}
.rightbox-header {
display: block;
background-color: #ffd3c7;
color: #ffffff;
}
.rightbox-body {
margin: 0;
padding: 1em;
display: block;
}
.rightbox-body-text {
display: flex;
align-items: center;
}
.rightbox-header h2 {
text-align: center;
margin: 0;
padding: 0.3em;
display: block;
}
.picture-text-item {
box-sizing: content-box;
display: inline-block;
margin: 1px;
padding: 1em;
text-align: left;
vertical-align: top;
white-space: normal;
}
.picture-item {
width: auto;
background-color: transparent;
margin-bottom: 0.5em;
text-align: center;
}
.picture-text-item .text-box {
font-size: 12px;
line-height: 1.5;
margin: 8px 0 5px;
}
.main-area {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: auto;
}
.right-area {
display: flex;
flex-wrap: wrap;
flex-direction: column;
width: 350px;
float: left;
}
.left-area {
display: flex;
flex-wrap: wrap;
flex-direction: column;
width: calc(100% - 370px);
box-sizing: border-box;
min-width: 320px;
}
.landmark {
margin-top: 12px;
margin-right: 12px;
margin-bottom: 12px;
margin-left: 12px;
border-top: 1px solid #FFD3C7;
border-bottom: 1px none #FFD3C7;
display: flex;
flex-flow: wrap;
flex-direction: row;
}
.landmark-new {
width: 123px;
border-right-color: #FFD3C7;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 10px;
}
.landmark-new-br {
width: 20px;
border-right-color: #FFD3C7;
float: left;
}
.landmark-new-img {
width: 100px;
border-right-color: #FFD3C7;
float: right;
margin-top: 7px;
text-align: center;
margin-right: 1px;
}
.landmark-recommend {
border-width: 5px 1px 5px 5px;
width: auto;
border-right-color: #FFD3C7;
margin-top: 5px;
margin-bottom: 5px;
margin-left: 21px;
padding-left: 1px;
}
.landmark-recommend-br {
width: 20px;
border-right-color: #FFD3C7;
}
.landmark-recommend-img {
width: auto;
margin-top: -83px;
text-align: center;
margin-right: 1px;
display: flex;
flex-flow: wrap;
flex-direction: row;
margin-left: 14px;
padding-left: 0px;
}
.landmark-recommend-img-unit {
border-width: 5px 1px 5px 5px;
width: 100px;
border-right-color: #FFD3C7;
float: right;
margin-top: 7px;
text-align: center;
margin-right: 1px;
margin-left: 10px;
}