Преобразование div в ul/li с сохранением форматаCSS

Разбираемся в CSS
Ответить
Гость
 Преобразование div в ul/li с сохранением формата

Сообщение Гость »

[*]необходимо создать HTML-документ, в котором будут показаны любые 20 стран на основе предоставленных данных. Покажите флаг, название, валюту и все регионы для каждой страны. Используйте неупорядоченный список для отображения каждого элемента и используйте CSS для визуальной группировки каждого элемента (например, границы или цвета заливки) без типичного маркера в списке. Показывать страницу Википедии в виде ссылки для каждой страны.
Мне пришлось изменить свой код так, чтобы я использовал элементы списка для своего кода и использовал неупорядоченный список для отображения каждого элемента, а затем использовал CSS для группировки каждого элемента.

Сейчас я использую div. Я пробовал использовать один большой URL-адрес, в котором каждая страна была бы элементом списка, но формат был бы другим. Я также попытался заменить свой div на li и обернуть все это в ul, но мне это не удалось. Вот фрагмент двух стран из 20.

.country-container { дисплей: гибкий; flex-wrap: обертка; оправдание-содержание: пространство между; разрыв: 10 пикселей; } /* Стиль для каждого блока страны */ .страна { гибкий: 1; дисплей: гибкий; гибкое направление: столбец; выровнять-элементы: по центру; граница: 3 пикселя, сплошная #212020; отступ: 1em; /* При необходимости увеличиваем отступы для интервалов внутри каждой страны */ выравнивание текста: по центру; цвет фона: бежевый; } /* Стиль изображения флага */ .флаг { /* Здесь нет необходимости в дополнительных стилях */ } /* Стиль названия страны */ .country h2 { поле: 5 пикселей 0; } /* Стиль ссылки на Википедию */ .вики-ссылка { дисплей: блок; выравнивание текста: по центру; поле сверху: 5 пикселей;
Изображение
Самоа Валюта: евро (EUR)

Регионы: Атуа, Фаасалелега, Туамасага
Википедия
Изображение
Пакистан
Валюта: рупия (PKR)

Регионы: Азад Джамму и Кашмир, Белуджистан, Гилгит-Балтистан, Исламабад, Хайбер-Пахтунхва, Пенджаб, Синд.
Википедия
Ответить

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

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

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

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

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