1 7-5 Lists within lists 2 3 4 ■ Lists within lists 5 6 Now that you have your profile sections set up, it's time to add in your favorite things! 7 8 You can do this by creating additional lists within your unordered list's <li> tags, like this: 9 <ul> 10 <li>Interests 11 12 <ol> 13 <li>Learning to code</li> 14 <li>Watching basketball</li> 15 <li>Playing music</li> 16 </ol> 17 18 </li> 19 </ul> 20 21 22 Within the <li> tag for Interests, we created an ordered list (<ol>) with three interests. 23 24 25 □ Instructions 26 Go nuts with your lists within lists! The only requirement is that you have at least one ordered list(<ol>) and one unordered list (<ul>). 27 28 Click "Stuck? Get a hint!" for more examples. 29 30 31 □ Hint 32 Remember, unordered lists work like this: 33 <ul> 34 <li>An item</li> 35 <li>Another item</li> 36 </ul> 37 38 And ordered lists work like this: 39 <ol> 40 <li>Item #1</li> 41 <li>Item #2</li> 42 </ol> 43 44 A list within a list might look like this: 45 <ul> 46 <li>Interests 47 <ul> 48 <li>Golf</li> 49 <li>Sleep</li> 50 <li>Lasers</li> 51 </ul> 52 </li> 53 <li>Favorite Teams 54 <ol><li></li><li></li><li></li></ol> 55 </li> 56 </ul> 57 58 59 60 ○単語・熟語・文型 61 62 63 64 ○説明&補足 65 ■ Lists within lists 66 / リストの入れ子(リストの中にリストを作る) 67 68 これで、プロファイルページの外枠(そとわく)は完成です。 69 いよいよ、 70 あなたの好きなこと 71 を、具体的に加えていきます。 72 73 やり方: 74 ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・ 75 <ul> 76 <li>好きなこと <!-- ① --> 77 78 <ol> 79 <li>プログラミング</li> 80 <li>バスケットボール観戦</li> 81 <li>演奏</li> 82 </ol> 83 84 </li> <!-- * ①’ --> 85 86 <li>きらいなこと 87 <ol> 88 <li></li><li></li> </ol> </li> 89 </ul> 90 ・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・ 91 ①の 92 「<li>好きなこと」タグ 93 の中の、 94 順序付きリスト(<ol> . . . </ol>) 95 に、 96 3つの好きなこと(<li> . . . </li>) 97 を加えています。 98 ①ʼ で、 99 ①「<li>好きなこと」 100 を、 101 閉じます。 102 * この"閉じる位置"に気を付けてください! 103 104 105 □ Instructions: あなたへのミッション 106 ======================================== 107 <!DOCTYPE html> 108 <html> 109 <head> 110 <title>なまえ</title> 111 </head> 112 <body> 113 <img src="http://s3.amazonaws.com/codecademy-blog/assets/ninja_zpsa5db e37a.jpg" /> 114 <p>年齢、性別、故郷</p> 115 <ul> 116 <li>項目 ①</li> 117 <li>項目 ②</li> 118 <li>項目 ③</li> 119 <li>項目 ④</li> 120 </ul> 121 </body> 122 </html> 123 ======================================== 124 ちょっと、目が回りそうなことですが、 125 気持ちを集中して挑戦しましょう! 126 リストの中にリストを入れること 127 を! 128 129 クリアするための最低条件は、 130 今ある、箇条書きのリスト 131 の中 132 に、 133 順序付きリスト 1つ 134 箇条書きリスト 1つ 135 を、作ることです! 136 137 138 □ Hint 139 ここに、いろいろな例を⽰します。 140 141 ① 箇条書きリスト 142 <ul> 143 <li>あるアイテム</li> 144 <li>他のアイテム</li> 145 </ul> 146 147 ②順序付きリスト 148 <ol> 149 <li>1番目のアイテム</i> 150 <li>2番目のアイテム</li> 151 </ol> 152 153 ③箇条書きリスト の中に 箇条書きリスト/順序付きリスト です. 154 155 <ul> <li>好きなこと 156 <!--好きなこと、開く--> <ul> 157 <li>ゴルフ</li> 158 <li>寝ること</li> 159 <li>レーザーって何さ?</li> 160 161 </ul> </li> <!--好きなこと、閉じる--> 163 <li>好きなチーム <!--好きなチームリスト、開く--> 164 <ol> 162 165 166 <li></li><li></li><li></li> </li> </ul> 167 168 169 7-5 Lists within lists </ol> <!--好きなチームリスト、閉じる-->
© Copyright 2024 ExpyDoc