42 lines
1.4 KiB
CSS
42 lines
1.4 KiB
CSS
/* CSS для генерации индекса файлов в каталоге */
|
|
body { font-family: monospace; }
|
|
h1#indextitle { text-align: left; }
|
|
|
|
table { border-collapse: collapse; min-width: 60%}
|
|
|
|
th { background-color: gray; padding: .5ex 1em; text-align: left}
|
|
td { padding: .5ex 1em; }
|
|
|
|
tr.odd td {
|
|
background-color: whitesmoke;
|
|
transition: background-color 0.8s ease; /* Плавный переход для фона */
|
|
}
|
|
tr.even td {
|
|
background-color: silver;
|
|
transition: background-color 0.8s ease; /* Плавный переход для фона */
|
|
}
|
|
|
|
a {text-decoration: none; color: black; border-bottom: 1px dotted black;}
|
|
a:hover { color: orange; border-bottom: 1px solid darkorange; transition: 0.8s; }
|
|
a:not(:hover) { transition: 1.8s } /* Этот transition сработает при убирании курсора */
|
|
|
|
/* Изменяем фон всех ячеек <td> в строке <tr>,
|
|
когда на любую ссылку <a> внутри этой строки наведен курсор.
|
|
Это создаст эффект подсветки всей строки. */
|
|
tr.odd:has(a:hover) td {
|
|
background-color: #2222F5;
|
|
color: orange;
|
|
}
|
|
tr.even:has(a:hover) td {
|
|
background-color: #222295;
|
|
color: orange;
|
|
}
|
|
|
|
/* черточка между строками */
|
|
hr {
|
|
border: 0; height: 1px;
|
|
background-color: transparent;
|
|
margin: 0; padding: 0;
|
|
}
|
|
|