- 15, May 2024
- #1
Хорошо . . . Итак, у меня появился этот веб-сайт, который я использую в качестве инструмента обучения (хотя мне кажется, что я учусь ОЧЕНЬ медленно), но, несмотря на это, я все еще работаю.
В любом случае, этот веб-сайт, на котором я учился, кажется, работает нормально на моем ноутбуке и мобильном телефоне Galaxy S6, но я вижу проблемы на своих планшетах.
Мой первый вопрос: на этом конкретном сайте я играю с градиентным фоном.
Опять же, он отлично отображается на моем ноутбуке и мобильном телефоне, но не отображается на моих планшетах с диагональю 7", 8" (Windows) и 10,1". Есть ли медиа-запрос "один размер, подходящий всем", который я могу/должен использовать? с использованием?
Второй вопрос: если не существует универсального размера, существует ли определенная максимальная ширина, которая может охватывать типичные размеры планшетов?
Третий вопрос: какова рекомендуемая максимальная ширина, которую следует использовать для покрытия настольных компьютеров/ноутбуков, планшетов и мобильных/мобильных телефонов?
Последний вопрос (на данный момент): о какой максимальной ширине мне следует беспокоиться, кроме настольного компьютера/ноутбука, планшетов и мобильных телефонов/мобильных телефонов?
И к вашему сведению.
. . медиа-запросы, которые я использую для этого конкретного сайта, следующие:
. .
В любом случае, этот веб-сайт, на котором я учился, кажется, работает нормально на моем ноутбуке и мобильном телефоне Galaxy S6, но я вижу проблемы на своих планшетах.
Мой первый вопрос: на этом конкретном сайте я играю с градиентным фоном.
Опять же, он отлично отображается на моем ноутбуке и мобильном телефоне, но не отображается на моих планшетах с диагональю 7", 8" (Windows) и 10,1". Есть ли медиа-запрос "один размер, подходящий всем", который я могу/должен использовать? с использованием?
Второй вопрос: если не существует универсального размера, существует ли определенная максимальная ширина, которая может охватывать типичные размеры планшетов?
Третий вопрос: какова рекомендуемая максимальная ширина, которую следует использовать для покрытия настольных компьютеров/ноутбуков, планшетов и мобильных/мобильных телефонов?
Последний вопрос (на данный момент): о какой максимальной ширине мне следует беспокоиться, кроме настольного компьютера/ноутбука, планшетов и мобильных телефонов/мобильных телефонов?
И к вашему сведению.
. . медиа-запросы, которые я использую для этого конкретного сайта, следующие:
@media (max-width:50em) {
body {
min-width:192px; /* CSS3 possible, so let it go narrower */
}
#contentWrapper,
#extras {
float:none;
width:auto;
}
#content,
#extras {
margin:0;
padding:1em 0.5em 0;
}
h2 {
font: bold 2.25em 'Merriweather', serif;
padding-bottom:0.66em;
color: #22B6FA;
}
h3 {
color: #000;
}
.testimonial {
padding-top:1em;
color: #000;
border-top:2px solid #22B6FA;
}
#product {
display:inline-block;
max-width:49%;
}
.price {
color: #22B6FA;
text-shadow: 1px 1px 1px #000;
}
}
@media (max-width:660px) {
h1 {
text-align:center;
padding:0;
}
h1 a {
padding:0.33em 0.167em;
font:bold 300%/150% 'Aclonica', sans-serif;
}
h1 span {
display:none;
}
#product {
display:block;
max-width:100%;
}
}
@media (max-width:340px) {
#products {
width:auto;
margin:0 auto;
-webkit-box-sizing:padding-box;
box-sizing:padding-box;
}
Код (разметка): И если эти запросы неверны или имеют проблемы, я был бы признателен за информацию о том, что я делаю неправильно, а также за любые предложения по улучшению/исправлению этого.
Заранее благодарим за любой вклад по этому поводу.
. .