Skip to main content

Type Attribute for Element List - HTML

Control element list for example a, A, 1, i and I via type attribute in <ol> element.


type="a"

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)

HTML

<ol type="a">
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (…And Justice For All, 1988)</li>
</ol>


type="A"

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)

HTML

<ol type="A">
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (…And Justice For All, 1988)</li>
</ol>


type="1"

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)

HTML

<ol type="1">
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (…And Justice For All, 1988)</li>
</ol>


type="i"

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)

HTML

<ol type="i">
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (…And Justice For All, 1988)</li>
</ol>


type="I"

  1. Creeping Death (Ride The Lightning, 1984)
  2. Master Of Puppets (Master Of Puppets, 1986)
  3. One (…And Justice For All, 1988)

HTML

<ol type="I">
  <li>Creeping Death (Ride The Lightning, 1984)</li>
  <li>Master Of Puppets (Master Of Puppets, 1986)</li>
  <li>One (…And Justice For All, 1988)</li>
</ol>

Comments

Popular posts from this blog

Create Vertical Text - CSS

From the old internet, the direction of text is pretty much fixed on left-to-right. In modern CSS has addressed the issue and supports vertical text with ease. Right to Left Vertical Text Right to Left Vertical Text HTML <div class= "v-rl" > <p> Right to Left </p> <p> Vertical Text </p> </div> CSS .v-rl { writing - mode : vertical - rl; } Left to Right Vertical Text Left to Right Vertical Text HTML <div class= "v-lr" > <p> Left to Right </p> <p> Vertical Text </p> </div> CSS .v-lr { writing - mode : vertical - lr; } All Characters Upright All Characters Upright Ultraman ウルトラマン HTML <div class= "t-upright" > <p> All Characters </p> <p> Upright </p> <p> Ultraman ウルトラマン </p> </div> CSS .t-upright { writing - mode : vertical - rl; text - orie...

Distortion Glitch Text Effect - CSS

  Use multiple text-shadow properly in CSS on a text by comma separating the values. DEMO Distortion CSS h2 { color : darkorange ; font-family : sans-serif ; font-size : 3.5em ; text-transform : uppercase ; text-shadow : -3px -3px 0 cyan , 3px 3px 0 pink ; }

Element Center and Middle - CSS

Make the element center and middle within the specific element width and height is easy using flex. This box centered! HTML   < div class = "box-center" > < strong > This box centered ! </ strong > < div > CSS . box - center { background - color: red; width: 100 % ; height: 200 px; display: flex; align - items: center; justify - content:center; } . box - center strong { background - color: limegreen; padding: 0.5 em; }