HTML5+CSS：

HTML中应用CSS的三种方法

一、内联

内联样式通过style属性直接套进HTML中去。

示例代码

  1. <pstylepstyle="color:red">text</p>

这将会是指定的段落变成红色。我们的建议是，HTML应该是独立的、样式自由的文档，所以内联样式无论在什么情况下都应该尽量避免。

二、内部

内部样式服务于整个当前页面。在头标签head里面，样式标签style里包含当前页面的所有样式。

示例代码

  1. <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html>
  4. <head>
  5. <title>CSSExample</title>
  6. <styletypestyletype="text/css">p{color:red;}a{color:blue;}</style>
  7. </head>
  8. <body>
  9. </body>
  10. </head>
  11. </html>

这将使这个页面的所有段落都是红色的，所有的连接都是蓝色的。与内联样式类似，同样不建议使用。

三、外部

外部样式为整个网站的多个页面服务。这是一个独立的CSS文档，简单的一个范例如下：

示例代码

  1. p{color:red;}a{color:blue;}

如果这个文档存为“web.css”的话，它可以这样跟HTML文档连接起来：

示例代码

  1. <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html>
  4. <head>
  5. <title>CSSExample</title>
  6. <linkrellinkrel="stylesheet"type="text/css"href="web.css"/>
  7. </head>
  8. <body>
  9. </body>
  10. </head>
  11. </html>

保存HTML文档，现在已经把HTML和CSS连接起来了，在你的html中就可以运用你在css文件中定义的css标签了。

HTML5+JavaScript：

HTML中应用JS的三种方法

一、Html5 页面中使用 <script> 标签容纳 JavaScript 代码；

1
2
3
<script>
   init();
</script>

这里不仅可以调用任意位置的函数，而且可以声明变量，构建函数和对象等等。

二、Html5 页面中使用 <script src="xxx.js"></script> 引入同路径下的 xxx.js 文件中的 JavaScript 代码；

1
<script src="js/main.js"></script>

注意这里的 main.js 是与当前 Html 页面文件同目录下的 js 子目录中的文件，使用时，确保相对路径正确，当然了，也可以使用绝对路径。

三、Html5 界面元素事件直接赋与一段 JavaScript 代码；

1
<input type="button" name="Button" value="Button" onclick="javascript：alert('测试')">

此处可参考javascript设置onclick

HTML5结合CSS的三种方法+结合JS的三种方法的更多相关文章

  1. json转js对象方法，JS对象转JSON方法

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  2. js调用.net后台事件，和后台调用前台等方法以及js调用服务器控件的方法

    http://blog.csdn.net/deepwishly/article/details/6670942  ajaxPro.dll基础教程(前台调用后台方法,后台调用前台方法) 1. javaS ...

  3. Chrome JS内存泄漏排查方法(Chrome Profiles)

     原文网址:http://blog.csdn.net/kaitiren/article/details/19974269 JS内存泄漏排查方法(Chrome Profiles)   Google Ch ...

  4. JS内存泄漏排查方法——Chrome Profiles

    一.概述 Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个.Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件 ...

  5. JS内存泄漏排查方法-Chrome Profiles

    原文链接:http://caibaojian.com/chrome-profiles.html 一.概述 Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是 ...

  6. [转]JS内存泄漏排查方法(Chrome Profiles)

    Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个.Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件,该描述文 ...

  7. 异步加载js的三种方法

    js加载时间线 : 它是根据js出生的那一刻开始记录的一系列浏览器按照顺序做的事,形容的就是加载顺序,可以用来优化什么东西,理论基础,背下来. 1.创建Document对象,开始解析web页面.解析H ...

  8. root的方法大体上有以下三种

    root的方法大体上有以下三种一.手机软件安卓版直接root.这种方法不需要电脑的支持,也很安全.安卓版软件有:kingroot,360一键root,一键root大师,Towelroot,支持云roo ...

  9. 使用CSS、JS的几种方法

    引用CSS到html网页里的4种方法 1.行内式 在标记的style属性中设定CSS样式,这种方式本质上没有体现出CSS的优势,因此不推荐使用     <div style="widt ...

随机推荐

  1. Android图像处理 - 高斯模糊的原理及实现

    欢迎大家前往云+社区,获取更多腾讯海量技术实践干货哦~ 由 天天P图攻城狮 发布在云+社区 作者简介:damonxia(夏正冬),天天P图Android工程师 前言 高斯模糊是图像处理中几乎每个程序员 ...

  2. AOF持久化

    AOF持久化是通话记录执行的命令进行存储的 AOF持久化的事先可以分为 (1)文件追加,新写入的命令都会被追加到redisserver的aof_buf缓冲区里面. 在服务器每一次执行事件循环的时候都会 ...

  3. css的浮动与定位

    显示与隐藏 标签 属性 值 效果 区别 css的style display none 元素不可见 不占页面空间 css的style visibility hidden 元素不可见 占页面空间 disp ...

  4. 企业Nginx+Keepalived双主架构案例实战

    通过上一次课程的学习,我们知道Nginx+keepalived主从配置,始终有一台服务器处于空余状态,那如何更好的利用起来呢,我们需要借助Nginx+keepalived双主架构来实现,如下图通过改装 ...

  5. wordpress配置固定链接nginx访问404问题解决方法

    WordPress支持使用固定链接,但是在ngnix环境下,访问页面后出现404, 其实官方是有文档说明的,需要单独写配置, 我这边配置的示例代码如下: server { listen       8 ...

  6. dedecms实现编辑文章时不自动修改发布时间

    dedecms默认编辑文章时自动修改文章的发布时间,如何让它不自动修改发布时间呢? 找到后台编辑文章的模板文件稍作调整即可. 文件/dede/templets/artical_edit.htm 把 $ ...

  7. JavaScript 中的对象深度复制(Object Deep Clone)

    JavaScript中并没有直接提供对象复制(Object Clone)的方法. JavaScript中的赋值,其实并不是复制对象,而是类似`c/c++`中的引用(或指针),因此下面的代码中改变对象b ...

  8. CENTOS6.6 下mysql MHA架构搭建

    本文来自我的github pages博客http://galengao.github.io/ 即www.gaohuirong.cn 摘要: 本篇是自己搭建的一篇mysql MHA文章 前面的安装步骤基 ...

  9. PV IP UV

    PV(访问量) Page View,页面浏览量. 具体的说,就是在一天内,该网站的页面总共访问了多少次 IP(独立IP) 一天内访问网站的IP数量 UV(独立访客) Unique Visitor 一般 ...

  10. JVM性能监控与故障处理命令汇总（jps、jstat、jinfo、jmap、jhat、jstack）

    给一个系统定位问题的时候,知识.经验是关键基础,数据是依据,工具才是运用知识处理数据的手段 使用适当的虚拟机监控和分析的工具可以加快我们分析数据.定位解决问题的速度,本文主要介绍了几款服 务器上常用的 ...