7

HTML と Css のリンクに問題があり、その理由がわかりません。私は本とチュートリアルが言うようにすべてをやっています。ただし、css の外部構成を行うことはできません。

これはコードです（単なるテストです）：

<!DOCTYPE html>
<html lang = "eng">
    <head>
        <meta name="viewport" content="width=device-width; initial-scale=1.0">

        <title>title</title>
        <meta name="description" content="">
        <meta name="keywords" content="">

        <link rel="stylesheets" type="text/css" href="/styles.css">
    </head>

    <body>
        <h1>test</h1>
    </body>
</html>

およびCSS:

body {
    background-color:#CCCCCC;
}

h1 {
    color:#0000EE;
}

内部 css (を使用して html コード内で) を実行すると、問題なく動作し、Web ブラウザーがそれを読み取ることができるため、何かを見落としている可能性があります。html は css とリンクされていないようですが、同じフォルダー上にあるため、パスは問題になりません。

Linux と Aptana Studio を使用しています。

過去 2 時間、何度も検索しましたが、間違いがどこにあるのかわかりません。

4

12 に答える 12

10

この記事を読むことをお勧めします絶対パスと相対パス

次に、コードに渡します。

<link rel="stylesheets" type="text/css" href="/styles.css">

する必要があります:

<link rel="stylesheet" type="text/css" href="styles.css">

htmlstyles.cssファイルと同じフォルダにある必要があります。

エラーがあることを確認するには、ブラウザのコンソールを確認してください。ファイルが存在しないことがわかります (404 エラー)。

CSS を機能させる別の方法は、分離せずにページ内に統合することです。

例：

 <style type='text/css'>

    body {
        background-color:#CCCCCC;
   }

    h1 {
        color:#0000EE;
    }
</style>
于 2013-08-24T23:30:12.387 に答える
1

同じ問題があり、正しいディレクトリ構造を修正して問題を解決しました。これは、ディレクトリ構造を整理する方法を視覚化したものです。

http://rosebusch.net/jeff/miscellaneous/tree.html

つまり、index.htmlフォルダーは CSS フォルダーと同じレベルにあります。HTML フォルダーに入れたい場合index.html、CSS フォルダーにリンクするには、最初にリンクしてバックアウトする必要がありますhref="../css/stylesheet.css"。レベルが上がります".."。

于 2016-01-20T20:53:14.090 に答える
0

代わりにこれを試してください：

<!DOCTYPE html>
<!-- Language was wrong? -->
<html lang = "en">
    <head>
        <meta name="viewport" content="width=device-width; initial-scale=1.0">

        <title>title</title>
        <meta name="description" content="">
        <meta name="keywords" content="">
<!-- Check the path to the file - I made it relative to where the HTML is -->
<!-- Correct the rel attribute's value too -->
        <link rel="stylesheet" type="text/css" href="./styles.css">
    </head>

    <body>
        <h1>test</h1>
    </body>
</html>
于 2013-08-24T20:57:02.970 に答える
0

CSS ファイルが別のフォルダーにある場合は、

<link rel="stylesheet" type="text/css" href="folder-name/styles.css">

于 2021-01-03T11:33:35.023 に答える