2015-08-13 33 views
0

http://www.abeautifulsite.net/whipping-file-inputs-into-shape-with-bootstrap-3/如何组装HTML,CSS和JS海誓山盟

你可以看到整个代码分为三个部分(HTML,CSS和JS)的“看在行动”一节。我是与asp.net合作的新人。我知道我可以把css和js代码放在不同的文件中,并且有一个包含html和asp.net标签的web表单,但是我真的不知道如何组装上面的代码来获得正确的输出。

请帮忙吗?

<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 &:一种方式,他们都可以走到一起

回答

2

一个简单的例子(也就是说,它也可以改变Css)

注 - HTML页面中唯一真正需要的是HTML本身,您可以添加指向其他文件而不是复制副本的其他资源的链接脚本如果你已经有了预先制作的文件,这可能是更好,更有意义的方法但是如果你是新手,我写的更容易理解,如果这是你第一次尝试所有这些,可能是最好的。祝你好运,新的web开发人员,可能会与你同在。 (:

+0

将脚本放在head标签中并不是一个好主意,因为它会减慢页面的加载时间,这是因为执行将在脚本加载时暂停,如果脚本文件的大小很大,它会花费较长时间来呈现页面。因此,建议在底部可能在正文结束之前将脚本标记放在底部。 – Novice

+0

@新手好吧,我已经改变了。当你通过参考链接到JS资源时,这也是真的吗? –

+0

对不起,错误的脚本引用必须在body标签结束之前,它是无效的在HTML标签内的body标签之后。 我不确定你指的JS资源是什么意思,你可以详细说明一下吗? – Novice

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尽快加载,因此用户看不到当它加载时,我的页面的未格式化版本。

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

因为这样,我确信当我执行我的脚本时,整个文档被加载和解析。