2016-06-07 3 views
1

Ich habe eine Zuweisung, die einen Teil hat, wo ich eine einfache geordnete Liste mit einer "Umriss" -Klasse aus dem enthaltenen Stylesheet erstellen muss. Zusätzlich brauche ich eine geordnete Liste mit nur dem Standard-Stil.So ziehen Sie bestimmte Stile aus einer Stylesheet-Klasse HTML

Das ist was ich bisher habe, egal was ich den Stil ändere, beide Listen bleiben mit römischen Ziffern nummeriert .. ich denke meine Syntax ist aus irgendeinem Grund, kann aber online keine Lösung finden.

<!DOCTYPE html> 
<html lang="en"> 

    <head> 
    <meta charset="UTF-8"> 
    <title>Assignment 1 - First Page</title> 
    <link rel="stylesheet" type="text/css" media="screen" href="assignment1-style.css"> 
    </head> 

    <body> 
    <h3>Sports</h3> 
    <dl> 
     <dt>Football</dt> 
     <dd>Most Popular Sport in America</dd> 
     <dt>Soccer</dt> 
     <dd>Most Popular Sport Worldwide</dd> 
     <dt>Ping Pong</dt> 
     <dd>A Very Underrated Sport</dd> 
    </dl> 
    <h3>Cities</h3> 
    <ol> 
     <li>Atlanta</li> 
     <li>New York</li> 
     <li>Los Angeles</li> 
     <ol type="a" start="4"> 
     <li>Nashville</li> 
     <li>Charlotte</li> 
     <li>Oklahoma City</li> 
     </ol> 
    </ol> 
    <h3>The Best Quarterbacks of All Time</h3> 
    <ol class="outline" type="A"> 
     <li>Peyton Mannning</li> 
     <li>Tom Brady</li> 
     <li>Joe Montana</li> 
     <li>Dan Marino</li> 
     <ol class="outline" start="5"> 
     <h4>Second Tier</h4> 
     <li>Steve Young</li> 
     <li>Warren Moon</li> 
     <li>Terry Bradshaw</li> 
     </ol> 
    </ol> 

    <h5><a href="second.html">Part Two of this Assignment</a></h5> 
    <h5><a href="https://en.wikipedia.org/wiki/Football">More Reading on Football</a></h5> 
    <p>This is a paragraph</p> 
    </body> 

</html> 

Dies ist der relevante Teil des Stylesheets.

ol > li { 
    list-style-type: upper-roman; 
    color: #00f5ff; 
    /* turquoise1 */ 
} 

ol > li > ol > li { 
    list-style-type: upper-alpha; 
    color: #00c5cd; 
    /* turquoise3 */ 
} 


/* outline line style lists */ 

ol.outline > li { 
    list-style-type: upper-roman; 
    color: #ff3e96; 
    /* VioletRed1 */ 
} 

ol.outline > li > ol > li { 
    list-style-type: upper-alpha; 
    color: #f0f; 
    /* Magenta */ 
} 

ol.outline > li > ol > li > ol > li { 
    list-style-type: decimal; 
} 

ol.outline > li > ol > li > ol > li > ol > li { 
    list-style-type: lower-alpha; 
} 

ol.outline > li > ol > li > ol > li > ol > li > ol > li { 
    list-style-type: lower-roman; 
} 

ol.outline > li > ol > li > ol > li > ol > li > ol > li > ol > li { 
    list-style-type: lower-greek; 
} 

Wenn ich den Stil der, die die Umrisse Klasse ändern waren zu senken-alpha oder ein anderes, nicht die Nummerierung der Listen ändern?

+0

Wollen Sie Aufzählungspunkte? – BradTheBrutalitist

Antwort

0

Denken Sie daran, dass > bedeutet verschachtelte, während + bedeutet Peer/gleich

ol > li { 
 
    list-style-type: upper-roman; 
 
    color: #00f5ff; /* turquoise1 */ 
 
} 
 

 
ol > li > ol > li { 
 
    list-style-type: upper-alpha; 
 
    color: #00c5cd; /* turquoise3 */ 
 
} 
 

 
/* outline line style lists */ 
 
ol.outline > li { /* PeytonM, TomB, JoeM, DanM */ 
 
    list-style-type: upper-roman; 
 
    color: purple; /* VioletRed1 */ 
 
} 
 

 
ol.outline > li + ol > li { /* SHOULD BE + ol not > ol */ 
 
    list-style-type: upper-alpha; 
 
    color: #f0f; /* Magenta */ 
 
} 
 

 
ol.outline > li > ol > li > ol > li { 
 
    list-style-type: decimal; 
 
} 
 

 

 
ol.outline > li > ol > li > ol > li > ol > li { 
 
    list-style-type: lower-alpha; 
 
} 
 

 
ol.outline > li > ol > li > ol > li > ol > li > ol > li { 
 
    list-style-type: lower-roman; 
 
} 
 

 
ol.outline > li > ol > li > ol > li > ol > li > ol > li > ol > li { 
 
    list-style-type: lower-greek; 
 
}
<h3>Sports</h3> 
 
<dl> 
 
    <dt>Football</dt> 
 
    <dd>Most Popular Sport in America</dd> 
 
    <dt>Soccer</dt> 
 
    <dd>Most Popular Sport Worldwide</dd> 
 
    <dt>Ping Pong</dt> 
 
    <dd>A Very Underrated Sport</dd> 
 
</dl> 
 
<h3>Cities</h3> 
 
<ol> 
 
    <li>Atlanta</li> 
 
    <li>New York</li> 
 
    <li>Los Angeles</li> 
 
    <ol type="a" start="4"> 
 
    <li>Nashville</li> 
 
    <li>Charlotte</li> 
 
    <li>Oklahoma City</li> 
 
    </ol> 
 
</ol> 
 
<h3>The Best Quarterbacks of All Time</h3> 
 
<ol class="outline" type="A"> 
 
    <li>Peyton Mannning</li> 
 
    <li>Tom Brady</li> 
 
    <li>Joe Montana</li> 
 
    <li>Dan Marino</li> 
 
    <ol class="outline" start="5"> 
 
    <h4>Second Tier</h4> 
 
    <li>Steve Young</li> 
 
    <li>Warren Moon</li> 
 
    <li>Terry Bradshaw</li> 
 
    </ol> 
 
</ol> 
 

 
<h5><a href="second.html">Part Two of this Assignment</a></h5> 
 
<h5><a href="https://en.wikipedia.org/wiki/Football">More Reading on Football</a></h5> 
 
<p>This is a paragraph</p>

+0

ohhhh, @gibberish, ich dachte, ich kontrolliere den Stil pro Liste, nur indem ich diktiere, was der Stil war. Ich habe nicht bemerkt, dass die Verschachtelung und Peer/equal einen anderen Stil pro Liste gesetzt hat. Vielen Dank, dass Sie das für mich geklärt –

+0

Froh, zu helfen. Um die Frage zu schließen, bitte upvote * (durch Klicken auf den Pfeil neben der Antwort) * ** und/oder ** als beste Antwort markieren * (durch Anklicken des Häkchens neben der Frage) *. – gibberish

Verwandte Themen