如何使用EachOther组装HTML,CSS和JS

时间:2015-08-13 20:33:06

标签: javascript html css asp.net

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

在“See in Action”部分中,您可以看到整个代码分为3个部分(HTML,CSS和JS)。我是asp.net的新手。我知道我可以将css和js代码放在不同的文件中,并且有一个包含html和asp.net标签的web表单,但实际上我不知道如何组装代码显示在上面的页面中以获得正确的输出。 / p>

请帮忙吗?

2 个答案:

答案 0 :(得分:2)

简单直接的例子,说明他们可以聚在一起的方式:

<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&amp;样式(这意味着它也可以改变Css)。

注意 - HTML页面中唯一真正需要的就是HTML本身。你可以添加链接到你在其他文件中编写的其他资源而不是复制脚本,如果你已经预先制作了文件,这可能是更好,更有用的方法 - 但是我写的那个更容易了解你是否是新手,如果这是你第一次尝试所有这些,那可能是最好的。祝你好运,新的网络开发,可能是你的力量。 (:

答案 1 :(得分: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在头标记中链接?

因为我希望尽快加载CSS,所以用户在加载时看不到页面的无样式版本。

为什么在页面底部调用脚本?

因为这样,我确信在执行脚本时会加载并解析整个文档。