Размер шрифта для контрольного списка [закрыто]Html

Программисты Html
Ответить
Anonymous
 Размер шрифта для контрольного списка [закрыто]

Сообщение Anonymous »

Я хочу внести некоторые изменения в контрольный список, который я сделал. Я пытаюсь изменить шрифт, но независимо от того, что я использую, например, DIV или классы, размер шрифта или цвет шрифта не меняются. Я не знаю, делает ли другой кусок кода его совпадать или что -то в этом роде, но это не имеет смысла, потому что независимо от того, что я пробую, ничего не работает. Помогите. Lang-CSS PrettyPrint-Override ">

Код: Выделить всё

html,
body {
height: 100%;
width: 100%;
overflow: scroll;
background-color: #d3dce6;
scroll-behavior: smooth;
font-family: "Courier Prime";
color: #4c585b;
}

body {
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
}

label {
font-size: 24px;
font-weight: 700;
cursor: pointer;
color: #525d6f;
opacity: 0.4;
transition: opacity 0.4s ease-in-out;
display: block;
width: calc(100% - 48px);
text-align: right;
z-index: 100;
user-select: none;
}

input[type="radio"] {
display: none;
width: 0;
}

label:hover,
input[type="radio"]:checked + label {
opacity: 1;
}

.popup {
width: 80%;
height: 80%;
min-height: 500px;
max-height: 1000px;
border-radius: 48px;
box-sizing: border-box;
border: 16px solid #ebf0f4;
background-color: #dfe6ed;
overflow: hidden;
box-shadow: 16px 16px 48px #2e364330;
display: flex;

.content {
display: none;
}

&:has(#tab1:checked) {
.content[data-tab="tab1"] {
display: block;
}
}

&:has(#tab2:checked) {
.content[data-tab="tab2"] {
display: block;
}
}
&:has(#tab3:checked) {
.content[data-tab="tab3"] {
display: block;
}
}
&:has(#tab4:checked) {
.content[data-tab="tab4"] {
display: block;
}
}
&:has(#tab5:checked) {
.content[data-tab="tab5"] {
display: block;
}
}
&:has(#tab6:checked) {
.content[data-tab="tab6"] {
display: block;
}
}
}

.tabs {
width: 100%;
max-width: 240px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-around;
position: relative;
}

.marker {
position: absolute;
width: 100%;
height: 200%;
display: flex;
flex-direction: column;
top: calc(-100%);
left: 0;
transition: transform 0.2s ease-in-out;
}

.marker #bottom,
.marker #top {
background-color: #ebf0f4;
box-shadow: 32px 32px 48px #2e364315;
}

.marker #top {
height: calc(50%);
margin-bottom: auto;
border-radius: 0 0 32px 0;
}

.marker #bottom {
height: calc(50% - 72px);
border-radius: 0 32px 0 0;
}

#tab1:checked ~ .marker {
transform: translateY(calc(calc(50% / 6) * 0));
}

#tab2:checked ~ .marker {
transform: translateY(calc(calc(50% / 6) * 1));
}

#tab3:checked ~ .marker {
transform: translateY(calc(calc(50% / 6) * 2));
}

#tab4:checked ~ .marker {
transform: translateY(calc(calc(50% / 6) * 3));
}

#tab5:checked ~ .marker {
transform: translateY(calc(calc(50% / 6) * 4));
}

#tab6:checked ~ .marker {
transform: translateY(calc(calc(51% / 6) * 5));
}

.content {
flex: 1;
padding: 26px;
overflow: scroll;
}

h2 {
font-family: "Abril Fatface";
font-weight: bold;
font-size: 26px;
text-align: center;
color: #4c585b;
text-shadow: 1px 3px #eef7ff;
padding: 9px;
border-style: dashed;
border-color: #a5bfcc;
border-width: 5px;
background-color: #e5e1da;
}
aside {
background-color: #e5e1da;
width: 30%;
color: #4c585b;
display: inline-flex;
flex-flow: column;
padding: 12px;
border: 5px dashed #a5bfcc;
vertical-align: top;
font-family: "Courier Prime";
}
.quote {
color: #7e99a3;
font-size: 20px;
text-indent: 50px;
line-height: 30px;
}
.ab {
background-color: #e5e1da;
display: inline-flex;
flex-flow: column;
padding: 24px;
border: 5px dashed #a5bfcc;
width: 55%;
margin-top: 0px;
}
input[type="submit"] {
background-color: #d0ddd0;
color: white;
padding: 6px 10px;
border: none;
border-radius: 4px;
cursor:  pointer;
}< /code>



Homepage

Daily Check-in

Calendar

Our Bot Linda

Puzzles

Collab w/ Amazon







The Daily Journal



 Quote of the Day 

 "Even the smallest positive change can ripple outwards, creating a beautiful effect on your day."



 Record Your Emotion 



 Enjoyment

 Excitement

 Happy

Confusion

 Anxious

 Fear

 Anger

 Disgust

 Bored

 Sadness

 Content




Content Second Tab
Content third Tab
Content fourth Tab
Content fifth Tab
amazon web services




Подробнее здесь: https://stackoverflow.com/questions/794 ... -checklist
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»