ミニマル実施例

<!DOCTYPE html> 
<html> 
<head> 
    <title>Horizontal Lists</title> 
    <meta charset="utf-8" /> 
    <style> 
     li.ans { 
      color: red; 
     } 

     ol.option { 
     } 

      ol.option > li { 
       list-style: lower-alpha; 
      } 
    </style> 
</head> 
<body> 
    <ol> 
     <li> 
      What is the capital of Japan? 
      <ol class="option"> 
       <li>New York</li> 
       <li>Jakarta</li> 
       <li class="ans">Tokyo</li> 
       <li>Kuala Lumpur</li> 
      </ol> 
     </li> 
     <li> 
      Who was granted a Noble prize for discovering photo electric effect? 
      <ol class="option"> 
       <li>Mike Tyson</li> 
       <li>Bill Gates</li> 
       <li>Donald Trump</li> 
       <li class="ans">Albert Einstein</li> 
      </ol> 
     </li> 
    </ol> 
</body> 
</html>

出力

所望の出力

質問

多肢選択式質問のための水平方向の順序付きリストの作成方法？

出典

2016-11-28 Artificial Stupidity

**多くの**多くの方法があります。何を試しましたか？チェックアウト[** LearnLayout.com **]（http://learnlayout.com/） –

ol.option { 
    display: flex; 
    justify-content: space-between; 
    max-width: 500px; 
    }

あなたのインラインスタイルにコードの上に追加して、レイアウトのフレキシボックスについての詳細を学ぶようにしてください。

出典

2016-11-28 17:11:07 akshaynaik404

多肢選択式質問のための水平方向の順序付きリストの作成方法？

ミニマル実施例

出力

所望の出力

質問

答えて

関連する問題