Back to Question Center
0

Семалтовите HTML списъци използват CSS

1 answers:

Опитвам се да пресъздам списък в HTML, който има клаузи и подклаузи като този:

     1. Основната клаузаа) подточкаб) подточка
2. Друга основна клаузаа) подточка    

Проблемите, с които се сблъсквам, са:

  1. Ако използвам съществуващите HTML елементи (ol и li), не изглежда да има стил на списък за (а) - мога да имам. ° С. или А. B - high ram vps. ° С. но не и а) б) в).

  2. Ако не използвам съществуващите HTML елементи и започна да използвам маркери за обхват, тогава ако подклаук излиза извън края на реда, той се появява под номера на клаузата,.

Подобно на:

     (а) Много дълъг раздел
който минава над един ред    

, когато това, което наистина искам, е поведението от списъците, което е:

     (а) Много дълъг разделкойто минава над един ред    

Има ли начин да се заобиколят тези два проблема едновременно? Бих предпочел да използвам семантични HTML и CSS за оформяне, но като имаме правилно разпределени клаузи, е по-важно от това да правите нещата "по правилния начин".

Може да имам нужда от подгрупи в даден момент (т.е.. (i), (ii) и т.н.), така че не мога да предположа, че (а) ще бъде максималната дълбочина на клаузата.

February 11, 2018

Вторият ви проблем може да бъде решен с CSS, използвайки списък-стил-позиция: външен;

  ul, ол
{списък-стил-позиция: отвън;
} 

Резултат:

  1. текст, който е дълъг иобгръща 

Първият ви проблем не може да бъде решен с CSS или HTML, тъй като няма официални опции (a), (b) и т.н. за подредени списъци. Така че, ако трябва да бъде оформен като такъв, ще трябва да станете творчески и да опитате неща като използването на

и динамично добавяне на вашите собствени елементи.

Можете да генерирате съдържание с помощта на преди и след това да го комбинирате с counter-reset и . След това, като използвате подложка върху генерираното съдържание, най-накрая можете да постигнете ефекта, който искате само с CSS.

Тук е референцията за това, как броячите работят върху CSS: http: // www. w3. Org / TR / CSS2 / генерира. html # propdef-брояч

И тук е доказателство за концепцията: http: // jsfiddle. net / p3U9j /

Семалтовите HTML списъци използват CSS
Reply