【html】【2】html引入外部文件js css
1》引入js
我们只是写了简单必须的html标签,从未给标签添加点击事件,这次页面添加事件.
》写入html页面,可以在<head>标签内 也可以在<body>标签内
<!DOCTYPE html>
<html>
<head>
<title>小娜娜</title>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
</head>
<body>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
<div>
这是main内容
</div>
</body>
</html>
》写在js文件内
你想啊,当js逻辑过多的时候 html中js代码过多,页面杂乱不说,维护修改起来特别不方便,于是 聪明的人类把 js代码与html代码分离出来了,
把代码写入以.js文件结尾的文件内,html页面引入外部js文件即可
<!DOCTYPE html>
<html>
<head>
<title>小娜娜</title>
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> //引入外部js文件
</head>
<body>
<div>
这是main内容
</div>
</body>
</html>
2》引入css样式【同上js】
不同之处在于,各自所用的标签不一样 css=》</style>标签 js=》<script>标签
<html>
<head>
<style type="text/css">
h1 {color: red}
p {color: blue}
</style>
</head> <body>
<h1>header 1</h1>
<p>A paragraph.</p>
</body>
</html>
外部css文件,以.css结尾文件
<html>
<head>
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
......
</body>
</html>
ok
【html】【2】html引入外部文件js css的更多相关文章
- 【jsp】怎么在jsp文件中引入静态文件(.js .css)
如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...
- Vue项目中引入外部文件(css、js、less)
例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步 ...
- vue3+typescript引入外部文件
vue3+typescript中引入外部文件有几种方法 (eg:引入echarts) 第一种方法: 1 indext.html中用script引入 <div id="app" ...
- 引入外部文件的时候为什么省略http:
[摘要]相信很多时候大家在使用网上的实例代码的时候,需要引入外部文件,然而它们通常都是省略了http:,这是为什么呢? 先给大家看一个简单的小例子,引入外部jquery文件: <script s ...
- nginx 引入外部文件
http { include mime.types; default_type application/octet-stream; #log_format main '$remote_addr - $ ...
- postman通过引入外部文件实现参数化
postman可通过引入外部文件进行参数化 目录 1.准备好接口信息 2.设置 1.准备好接口信息 这里的usr和psw是要参数化的对象 2.设置 文件准备 添加文件,并设置好循环次数即可
- js 引入外部文件之 script 标签
在我的理解看来,html 就是一个单纯的管显示问题,js就是单纯的管动作问题,css就是单纯的管布局问题,这三个构成了一个网页 在HTML中,经常会用到引入js 文件. 引入js的方法很简单: 1. ...
- react如何引入外部文件的整理
1 引入组件 首先就应该是安装了,安装在环境中后通过 import { Select, Button, Icon, QueueAnim } from 'antd'; 就可以把需要的组件引用进来了~ 2 ...
- HTML引入外部文件,解决统一管理导航栏问题。
1.IFrame引入,看看下面的代码 <IFRAME NAME="content_frame" width=100% height=30 marginwidth=0 ...
随机推荐
- Java如何将Exception.printStackTrace()转换为String输出
package com.test1; import java.io.PrintWriter; import java.io.StringWriter; public class T010 { /** ...
- HDU-2562 奇偶位互换
http://acm.hdu.edu.cn/showproblem.php?pid=2562 奇偶位互换 Time Limit: 3000/1000 MS (Java/Others) Memor ...
- DBA的那些事
--Author:Leshami --Blog :http://blog.csdn.ne/leshami 说起DBA,全称是Database Administrator,不是Doctor of ...
- C# config配置文件 自定义节点读取
主要使用:ConfigurationSection IConfigurationSectionHandler已被否决 http://technet.microsoft.com/zh-cn/librar ...
- HTML5 application cache
Application Cache API (一) 基本应用 http://www.cnblogs.com/blackbird/archive/2012/06/12/2546751.html Appl ...
- Python运行机制
闲来无事,简单画了一下Python的运行机制,纯属娱乐:
- 【转】Flask安装
Flask 依赖两个外部库:Werkzeug 和 Jinja2 . Werkzeug 是一个 WSGI(在 Web 应用和多种服务器之间的标准 Python 接口) 工具集.Jinja2 负责渲染模板 ...
- struts2 表单处理
在这篇教程里我们将探究如何处理表单提交.本文例子介绍: javabean存储表单数据 在action中重写validate方法进行简单的校验 创建一个struts2表单并和javabean匹配 jav ...
- 将PL/SQL代码封装在机灵的包中
将代码封装在机灵的包中 http://www.oracle.com/technetwork/issue-archive/2013/13-jan/o13plsql-1872456.html 绝大多数基于 ...
- android 64 sd卡读写的操作
package com.itheima.writesd; import java.io.File; import java.io.FileNotFoundException; import java. ...