私のテキストをインラインで表示させるのに苦労します

私のulセクションに私のコードを同じ行に表示させようとしていますが、まだ垂直リストに表示しています。私はこれに新しいので、なぜ同じ行に行かないのか理解できません。私はdisplay:inline-block;とfloat:left;を試しましたが、うまくいきませんでした。私のテキストをインラインで表示させるのに苦労します

HTML：

<!doctype html> 
<html> 
<head> 
    <title>practice.co.uk</title> 
    <link href="main2.css" rel="stylesheet" type="text/css"/> 
</head> 
<body> 
    <h1>My Webpage</h1> 
    <nav> 
     <ul> 
      <li><a href="index.html">Home</a></li> 
      <li><a href="page2.html">Page 2</a></li> 
     </ul> 
    </nav> 
    <h2>Page 2</h2> 
    <p>All the content of Page 2</p> 
</body> 
</html>

CSS：

body nav ul li { 
    display: inline-block; 
}

出典

2017-05-02 S. Ol

はあなたのページがあなたのCSSファイルを読み込むことができることを確認したことがありますか？ –

あなたはあなたが持っているコードをすべて投稿してもよろしいですか？ –

あなたは右のそれを持っています。 cssファイルが正しく命名され、main2.cssがhtmlファイルと同じディレクトリにあることを確認してください。

出典

2017-05-02 20:41:14 Nathan

は、スニペットに挿入したときに正常に機能します。下記を参照してください。スタイルシートやタイプミスのためにファイルパスを確認してください...

body nav ul li{ 
 
    display:inline-block; 
 
}

<!doctype html> 
 
<html> 
 
    <head> 
 
     <title>practice.co.uk</title> 
 
     <link href="main2.css" rel="stylesheet"> 
 
    </head> 
 
    <body> 
 
     <h1>My Webpage</h1> 
 
     <nav> 
 
      <ul> 
 
       <li><a href="index.html">Home</a></li> 
 
       <li><a href="page2.html">Page 2</a></li> 
 
      </ul> 
 
     </nav> 
 
     <h2>Page 2</h2> 
 
     <p>All the content of Page 2</p> 
 
    </body> 
 
</html>

出典

2017-05-02 20:44:44 Johannes

私のテキストをインラインで表示させるのに苦労します

答えて

関連する問題