如何相互組裝HTML，CSS和JS

Question

http://www.abeautifulsite.net/whipping-file-inputs-into-shape-with-bootstrap-3/

在“實際操作中看到”部分，您可以看到整個代碼分為3部分（HTML，CSS和JS）。 我是使用asp.net的新手。 我知道我可以將css和js代碼放在不同的文件中，並具有包含html和asp.net標記的Web表單，但實際上我不知道如何匯編代碼如上頁所示以獲取正確的輸出。

有什么幫助嗎？

Answer 1

它們可以組合在一起的簡單示例：

<html>
  <head>
    <style>
      /* PUT YOUR CSS HERE */
    </style>
   </head>
   <body>
     <!-- PUT YOUR HTML HERE -->
     <script>
      // PUT YOUR JS HERE
     </script>
   </body>
</html>

這樣，它們全部聚集在一個頁面上，並且可以相互影響（Css可以影響HTML，而JS可以影響html＆樣式（這意味着它也可以更改Css））。

注意-HTML頁面中唯一真正需要的是HTML本身。 如果您已經預先制作了文件，則可以添加指向其他文件中編寫的其他資源的鏈接，而不是復制粘貼腳本，這可能是一種更好，更原始的方法-但是我寫的那種方法更容易實現了解您是否是新手，如果這是您第一次嘗試所有這些，那可能是最好的。 祝您好運，新的網絡開發人員，也許力量與您同在。 （：

Answer 2

這是我通常使用的文件結構：

/
|_index.html
|
|_assets/
        |_css/
        |    |_style.css
        |
        |_ js/
             |_script.js

我的index.html通常看起來像這樣：

<!doctype html>
<html>
<head>
  <title>Test page</title>
  <link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
  <h1>Hello world!</h1>
  <script src="assets/js/script.js"></script>
</body>
</html>

為什么CSS鏈接在head標簽中？

因為我希望CSS能夠盡快加載，所以用戶在加載頁面時不會看到未樣式化的頁面版本。

為什么在頁面底部調用該腳本？

因此，我確定執行腳本時會加載並解析整個文檔。

如何相互組裝HTML，CSS和JS

問題描述

2 個解決方案

解決方案1
2 已采納 2015-08-13 20:35:36

解決方案2
2 2015-08-13 20:41:25

如何相互組裝HTML，CSS和JS

問題描述

2 個解決方案

解決方案1 2 已采納 2015-08-13 20:35:36

解決方案2 2 2015-08-13 20:41:25

解決方案1
2 已采納 2015-08-13 20:35:36

解決方案2
2 2015-08-13 20:41:25