HTML学习,常用常记(颜色,脚本,字符实体,统一资源定位器URL,速查,XHTML)

el/2023/12/3 2:42:55
<p style="background-color:#FFFF00">通过十六进制设置背景颜色</p><p style="background-color:rgb(255,255,0)">通过 rbg 值设置背景颜色</p><p style="background-color:yellow">通过颜色名设置背景颜色</p>

三种颜色 红,绿,蓝的组合从0到255,一共有1600万种不同颜色(256 x 256 x 256);

RGBA 的意思是(Red-Green-Blue-Alpha)它是在 RGB 上扩展包括了 “alpha” 通道,运行对颜色值设置透明度。相对于使用 rgb(255,255,0),使用 rgba(255,255,0,0.5) 可以实现设置颜色透明度的功能,这里的 0.5 表示透明度,范围 0~1,0 表示全透明。

HTML拾色器;

目前所有浏览器都支持以下颜色名(颜色名,颜色值):

  • 141个颜色名称是在HTML和CSS颜色规范定义的(17标准颜色,再加124);
  • 17标准颜色:黑色,蓝色,水,紫红色,灰色,绿色,石灰,栗色,海军,橄榄,橙,紫,红,白,银,蓝绿色,黄色;
<script>
document.write("Hello World!")
</script> 
<noscript>抱歉,你的浏览器不支持 JavaScript!</noscript><p>不支持 JavaScript 的浏览器会使用 &lt;noscript&gt; 元素中定义的内容(文本)来替代。</p>

HTML <script> 标签

  • <script> 标签用于定义客户端脚本,比如 JavaScript
  • <script> 元素既可包含脚本语句,也可通过 src 属性指向外部脚本文件
  • JavaScript 最常用于图片操作、表单验证以及内容动态更新
<h1>我的第一个 JavaScript </h1><p id="demo">
JavaScript 可以触发事件(也可以改变样式),就像按钮点击。</p><script>
function myFunction(){document.getElementById("demo").innerHTML="Hello JavaScript!";                             x=document.getElementById("demo") // 找到元素x.style.color="#ff0000";          // 改变样式
}
</script><button type="button" onclick="myFunction()">点我</button>

HTML 字符实体

  • HTML 中的预留字符必须被替换为字符实体。
  • 一些在键盘上找不到的字符也可以使用字符实体来替换。

HTML 实体

  • 在 HTML 中,某些字符是预留的。
  • 在 HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误认为它们是标签。
  • 如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体。
  • 如需显示小于号,我们必须这样写:&lt; 或 &#60; 或 &#060。

结合音标符,字符实体;

统一资源定位器(Uniform Resource Locators):runoob.com;192.68.20.50;

一个网页地址实例: http://www.runoob.com/html/html-tutorial.html 语法规则:

scheme://host.domain:port/path/filename

说明:

  • scheme - 定义因特网服务的类型。最常见的类型是 http
  • host - 定义域主机(http 的默认主机是 www)
  • domain - 定义因特网域名,比如 runoob.com
  • :port - 定义主机上的端口号(http 的默认端口号是 80)
  • path - 定义服务器上的路径(如果省略,则文档必须位于网站的根目录中)。
  • filename - 定义文档/资源的名称

URL字符编码;

HTML速查列表;

HTML - XHTML

  • XHTML 是以 XML 格式编写的 HTML。

什么是 XHTML?

  • XHTML 指的是可扩展超文本标记语言
  • XHTML 与 HTML 4.01 几乎是相同的
  • XHTML 是更严格更纯净的 HTML 版本
  • XHTML 是以 XML 应用的方式定义的 HTML
  • XHTML 是 2001 年 1 月发布的 W3C 推荐标准
  • XHTML 得到所有主流浏览器的支持

为什么使用 XHTML?

  • 因特网上的很多页面包含了"糟糕"的 HTML。

与 HTML 相比最重要的区别:

文档结构

  • XHTML DOCTYPE 是强制性的
  • <html> 中的 XML namespace 属性是强制性的
  • <html>、<head>、<title> 以及 <body> 也是强制性的

元素语法

  • XHTML 元素必须正确嵌套
  • XHTML 元素必须始终关闭
  • XHTML 元素必须小写
  • XHTML 文档必须有一个根元素

属性语法

  • XHTML 属性必须使用小写
  • XHTML 属性值必须用引号包围
  • XHTML 属性最小化也是禁止的

下面的例子展示了带有最少的必需标签的 XHTML 文档:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head><meta charset="utf-8"><title>文档标题</title>
</head><body>
文档内容
</body>
</html>

如何将 HTML 转换为 XHTML

  1. 添加一个 XHTML <!DOCTYPE> 到你的网页中
  2. 添加 xmlns 属性添加到每个页面的html元素中
  3. 改变所有的元素为小写
  4. 关闭所有的空元素
  5. 修改所有的属性名称为小写
  6. 所有属性值添加引号

使用 W3C 验证器来测试你的 XHTML


http://www.ngui.cc/el/2274575.html

相关文章

HTML5学习,常用常记(浏览器,更新)

<!DOCTYPE html> <html> <head><meta charset"utf-8"><title>为 HTML 添加新元素</title><script>document.createElement("myHero")</script><style>myHero {display: block;background-color: #d…

HTML5学习,常用常记(canvas,SVG)

什么是 canvas? HTML5 <canvas> 元素用于图形的绘制&#xff0c;通过脚本 (通常是JavaScript)来完成.<canvas> 标签只是图形容器&#xff0c;您必须使用脚本来绘制图形。你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像。 <canvas id"…

HTML5学习,常用常记(MathML,拖放,定位)

HTML5 MathML HTML5 可以在文档中使用 MathML 元素&#xff0c;对应的标签是 <math>...</math> 。MathML 是数学标记语言&#xff0c;是一种基于XML&#xff08;标准通用标记语言的子集&#xff09;的标准&#xff0c;用来在互联网上书写数学符号和公式的置标语言…

HTML5学习,常用常记(Video,Audio,Input)

检测您的浏览器是否支持 HTML5 视频&#xff1b; <video width"320" height"240" controls><source src"movie.mp4" type"video/mp4"><source src"movie.ogg" type"video/ogg">您的浏览器不支…

HTML5学习,常用常记(表单元素,表单属性(真心多,但真的常用))

HTML5 <datalist> 元素 <datalist> 元素规定输入域的选项列表。<datalist> 属性规定 form 或 input 域应该拥有自动完成功能。当用户在自动完成域中开始输入时&#xff0c;浏览器应该在该域中显示填写的选项&#xff1a;使用 <input> 元素的列表属性与…

HTML5学习,常用常记(语义元素,Web存储(。。。))

什么是语义元素? 一个语义元素能够清楚的描述其意义给浏览器和开发者。无语义 元素实例: <div> 和 <span> - 无需考虑内容.语义元素实例: <form>, <table>, and <img> - 清楚的定义了它的内容. HTML5 <section> 元素 <section> 标…

HTML5学习,常用常记(Web SQL,应用程序缓存)

HTML5 Web SQL 数据库 Web SQL 数据库 API 并不是 HTML5 规范的一部分&#xff0c;但是它是一个独立的规范&#xff0c;引入了一组使用 SQL 操作客户端数据库的 APIs。如果你是一个 Web 后端程序员&#xff0c;应该很容易理解 SQL 的操作。你也可以参考我们的 SQL 教程&#x…

HTML5学习,常用常记(Web Worker,服务器发送事件,其他功能)

什么是 Web Worker&#xff1f; 当在 HTML 页面中执行脚本时&#xff0c;页面的状态是不可响应的&#xff0c;直到脚本已完成。web worker 是运行在后台的 JavaScript&#xff0c;独立于其他脚本&#xff0c;不会影响页面的性能。您可以继续做任何愿意做的事情&#xff1a;点击…

JAVA概述(知到课程 + 菜鸟教程随笔)

一次编写&#xff0c;处处运行&#xff1b; 字节码文件&#xff0c;JAVA虚拟机&#xff1b; 面向对象&#xff0c;封装继承多态&#xff0c;多线程&#xff1b; JAVA 2se桌面开发低端商务应用 1ee企业 3me消费产品和嵌入式设备&#xff1b; jar.exe打包java文件&#xff0c…

JAVA学习,常用常记(基础语法,标识符,修饰符,关键字,注释(菜鸟教程))

Java 基础语法 一个Java程序可以认为是一系列对象的集合&#xff0c;而这些对象通过调用彼此的方法来协同工作。下面简要介绍下类、对象、方法和实例变量的概念。 对象&#xff1a;对象是类的一个实例&#xff0c;有状态和行为。例如&#xff0c;一条狗是一个对象&#xff0c…