Khác biệt giữa các bản “Bản mẫu:BKTT:Toàn bộ/styles.css”
Dòng 1: Dòng 1:
 +
.group-layout {
 +
    display: flex;
 +
    flex-wrap: wrap;
 +
}
 +
 +
.group-layout .group {
 +
    flex: 0 0 calc(50% - 10px);
 +
}
 +
 +
.group-layout .group:nth-child(odd) {
 +
    margin-right: 20px;
 +
}
 +
 
.q1 {
 
.q1 {
 
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/9/92/Isotoxal_octagon_rhombic_dissection.jpg);
 
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/9/92/Isotoxal_octagon_rhombic_dissection.jpg);

Phiên bản lúc 09:47, ngày 28 tháng 10 năm 2020

.group-layout {
    display: flex;
    flex-wrap: wrap;
}

.group-layout .group {
    flex: 0 0 calc(50% - 10px);
}

.group-layout .group:nth-child(odd) {
    margin-right: 20px;
}

.q1 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/9/92/Isotoxal_octagon_rhombic_dissection.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}

.q2 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/e/ea/CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}

.article-text {
    padding-bottom: 6px;
    padding-left: 6px;
    position: absolute;
    bottom: 0;
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    width: calc(100% - 5px);
}