问题与CSS样式表功能有关。

huangapple
go评论86阅读模式
英文:

Problem with CSS style sheet functionaltiy

问题

我在VS Code中创建一个HTML页面，并尝试为一个div元素添加样式，但是我的CSS样式表中的设置似乎都不起作用。

我已经确认我的HTML文件正在引用CSS文件，并且通过W3C CSS验证器运行了CSS代码。

HTML

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <link rel="stylesheet" type="text/css" href="/Untitled/csss/style.css">
  8.     <title>License Manager</title>
  9. </head>
  10. <body>
  11.     <div class="login">
  12.         <textarea rows="1" cols="20">
  13.             password
  14.         </textarea>
  15.         <button>
  16.             Authenticate
  17.         </button>
  18.     </div>
  19. </body>
  20. </html>

CSS

  1. body {
  2.     background-color: gray;
  3. }
  5. .login {
  6.     position: absolute;
  7.     top: 0;
  8.     bottom: 0;
  9.     left: 0;
  10.     right: 0;
  11.     margin: auto;
  12.     border-width: 10px;
  13.     border-color: black;
  14. }
英文:

I'm creating an HTML page in VS Code and trying to style a div, however none of the settings in my CSS stylesheet seem to be working.

I have confirmed my HTML is referencing the CSS file and ran the CSS code through the W3C CSS validator.

HTML

  1. &lt;!DOCTYPE html&gt;
  2. &lt;html lang=&quot;en&quot;&gt;
  3. &lt;head&gt;
  4.     &lt;meta charset=&quot;UTF-8&quot;&gt;
  5.     &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
  6.     &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
  7.     &lt;link rel=&quot;sytlesheet&quot; type=&quot;text/css&quot; href=&quot;/Untitled/csss/style.css&quot;&gt;
  8.     &lt;title&gt;License Managert&lt;/title&gt;
  9. &lt;/head&gt;
  10. &lt;body&gt;
  11.     &lt;div class=&quot;login&quot;&gt;
  12.         &lt;textarea rows=&quot;1&quot; cols=&quot;20&quot;&gt;
  13.         password
  14.         &lt;/textarea&gt;
  15.         &lt;button&gt;
  16.         Authenticate
  17.         &lt;/button&gt;
  18.     &lt;/div&gt; 
  19. &lt;/body&gt;
  20. &lt;/html&gt;

CSS

  1. body{
  2.     background-color: gray;
  3. }
  5. .login{
  6.     position: absolute;
  7.     top: 0;
  8.     bottom: 0;
  9.     left: 0;
  10.     right: 0;
  11.     margin: auto;
  12.     border-width: 10px;
  13.     border-color: black;
  14. }

答案1

得分: 0

更改：

  1. &lt;link rel=&quot;sytlesheet&quot; type=&quot;text/css&quot; href=&quot;/Untitled/csss/style.css&quot;&gt;

为：

  1. &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;/Untitled/csss/style.css&quot;&gt;

你拼错了 "stylesheet"。

英文:

Change:

  1. &lt;link rel=&quot;sytlesheet&quot; type=&quot;text/css&quot; href=&quot;/Untitled/csss/style.css&quot;&gt;

to:

  1. &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;/Untitled/csss/style.css&quot;&gt;

you have stylesheet misspelled.

huangapple
  • 本文由 发表于 2023年3月4日 05:37:52
  • 转载请务必保留本文链接：https://go.coder-hub.com/75632101.html
  • css
  • html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定