内联元素：
内联元素在显示时通常不会以新行开始。
实例: ,
, , 表单：
二.CSS
CSS (Cascading Style Sheets，层叠样式表），是一种用来为结构化文档（如 HTML 文档或 XML 应用）添加样式（字体、间距和颜色等）的计算机语言，CSS 文件扩展名为 .css。
语法： CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。
选择器通常是您需要改变样式的 HTML 元素。
每条声明由一个属性和一个值组成。
属性（property）是希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。
CSS声明总是以分号 ; 结束，声明总以大括号 {} 括起来。
p
{
color:red;
text-align:center;
}
注释： // or /* ### */
ID选择器： id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 “#” 来定义。
#para1
{
text-align:center;
color:red;
}
ID属性不要以数字开头，数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。
class选择器： class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。class 选择器在 HTML 中以 class 属性表示, 在 CSS 中，类选择器以一个点 . 号显示：
.center {text-align:center;}
也可以指定特定的 HTML 元素使用 class:
p.center {text-align:center;}
样式表：
外部样式表(External style sheet)：当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，可以通过改变一个文件来改变整个站点的外观。每个页面使用 标签链接到样式表。 标签在（文档的）头部：
外部样式表可以在任何文本编辑器中进行编辑。文件不能包含任何的 html 标签。样式表应该以 .css 扩展名进行保存。
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("/images/back40.gif");}
注： 不要在属性值与单位之间留有空格（如：“margin-left: 20 px” ），正确的写法是 “margin-left: 20px” 。
内部样式表(Internal style sheet)：当单个文档需要特殊的样式时，就应该使用内部样式表。
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
内联样式(Inline style)：要使用内联样式，需要在相关的标签内使用样式（style）属性。Style 属性可以包含任何 CSS 属性.
这是一个段落。
多重样式优先级：
（内联样式）Inline style > （内部样式）Internal style sheet >（外部样式）External style sheet > 浏览器默认样式
背景：
background-color
颜色值通常以以下方式定义：
十六进制值 – 如: ＃FF0000
一个RGB值 – 如: **RGB(255,0,0) **
颜色的名称 – 如: red
background-image
background-repeat
background-attachment
background-position
文本：
颜色：
十六进制值 – 如: **＃FF0000 **
一个RGB值 – 如: **RGB(255,0,0) **
颜色的名称 – 如: red
body {color:red;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}
对齐方式：
h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}
文本修饰：
text-decoration 属性用来设置或删除文本的装饰。
h1 {text-decoration:overline;} //上划线
h2 {text-decoration:line-through;} //删除线
h3 {text-decoration:underline;} //下划线
文本转换：文本转换属性是用来指定在一个文本中的大写和小写字母。可用于所有字句变成大写或小写字母，或每个单词的首字母大写。
p.uppercase {text-transform:uppercase;} //大写
p.lowercase {text-transform:lowercase;} //小写
p.capitalize {text-transform:capitalize;} //首字母大写
字体：
字体样式：
字体大小：font-size
绝对大小：
设置一个指定大小的文本
不允许用户在所有浏览器中改变文本大小
确定了输出的物理尺寸时绝对大小很有用
相对大小：
相对于周围的元素来设置大小
允许用户在浏览器中改变文字大小
字体大小像素：
h1 {font-size:40px;}
h2 {font-size:30px;}
p {font-size:14px;}
用em来设置字体大小：px/16=em
h1 {font-size:2.5em;} /* 40px/16=2.5em */
h2 {font-size:1.875em;} /* 30px/16=1.875em */
p {font-size:0.875em;} /* 14px/16=0.875em */
链接：
a:link – 正常，未访问过的链接
a:visited – 用户已访问过的链接
a:hover – 当用户鼠标放在链接上时
a:active – 链接被点击的那一刻
a:link {color:#000000;} /* 未访问链接*/
a:visited {color:#00FF00;} /* 已访问链接 */
a:hover {color:#FF00FF;} /* 鼠标移动到链接上 */
a:active {color:#0000FF;} /* 鼠标点击时 */
a:hover 必须跟在 a:link 和 a:visited后面
a:active 必须跟在 a:hover后面
三.JavaScript
HTML 中的 Javascript 脚本代码必须位于 与 · 标签之间。
Javascript 脚本代码可被放置在 HTML 页面的 和 部分中。
如需使用外部文件，请在 标签的 “src” 属性中设置该 .js 文件：
输出：
使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 document.write() 可以向文档写入内容。如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。
使用 innerHTML 写入到 HTML 元素。
如需从 JavaScript 访问某个 HTML 元素，可以使用 document.getElementById(id ) 方法。
document.getElementById("demo").innerHTML = "段落已修改。";
以上 JavaScript 语句（在
语法：
字面量：
数字字面量：整数或者是小数，或者是科学计数(e)；
字符串字面量：可以使用单引号或双引号；
表达式字面量：用于计算；
数组字面量；
对象字面量：定义一个对象
{firstName:”John”, lastName:”Doe”, age:50, eyeColor:”blue”}
函数字面量：定义一个函数
function myFunction(a, b) { return a * b;}
变量：JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值。
如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。
var x, length;
x = 5;
length = 6;
变量必须以字母开头;
变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）;
变量名称对大小写敏感（y 和 Y 是不同的变量）。
value = undefined：在计算机程序中，经常会声明无值的变量。未使用值来声明的变量，其值实际上是 undefined。
操作符：
算术运算符：+ – * /
赋值运算符
条件，比较及逻辑运算符：== !=
语句：分号分隔
关键字：
abstract
else
instanceof
super
boolean
enum
int
switch
break
export
interface
synchronized
byte
extends
let
this
case
false
long
throw
catch
final
native
throws
char
finally
new
transient
class
float
null
true
const
for
package
try
continue
function
private
typeof
debugger
goto
protected
var
default
if
public
void
delete
implements
return
volatile
do
import
short
while
double
in
static
with
注释：//### or /* ### */
数据类型：
值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol。
字符串（String)：可以是引号中的任意文本，使用单引号或双引号；
数字（Number）：JavaScript 只有一种数字类型。数字可以带小数点，也可以不带；
极大或极小的数字可以通过科学（指数）计数法来书写：
var y=123e5; // 12300000
var z=123e-5; // 0.00123
布尔（Boolean）：布尔（逻辑）只能有两个值：true 或 false；
引用数据类型（对象类型）：对象(Object)、数组(Array)、函数(Function)。
数组：
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
或
var cars=new Array("Saab","Volvo","BMW");
对象：由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。
属性由逗号分隔：
var person={firstname:"John", lastname:"Doe", id:5566};
var person={
firstname : "John",
lastname : "Doe",
id : 5566
};
对象属性有两种寻址方式：
name=person.lastname;
name=person["lastname"];
访问对象方法：
methodName : function() {
// 代码
}
objectName.methodName
还有两个特殊的对象：正则（RegExp）和日期（Date）。
var length = 16; // Number 通过数字字面量赋值
var points = x * 10; // Number 通过表达式字面量赋值
var lastName = "Johnson"; // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"]; // Array 通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"}; // Object 通过对象字面量赋值
变量的数据类型可以使用 typeof 操作符来查看：
typeof "John" // 返回 string
typeof 3.14 // 返回 number
typeof false // 返回 boolean
typeof [1,2,3,4] // 返回 object
typeof {name:'John', age:34} // 返回 object
声明新变量时，可以使用关键词 “new” 来声明其类型：
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
JavaScript 变量均为对象。当声明一个变量时，就创建了一个新的对象。
函数：
包裹在花括号中的代码块，前面使用了关键词 function：
function functionname()
{
// 执行代码
}
function myFunction(var1,var2)
{
//代码
}
JavaScript 对大小写是敏感的，关键词 function 必须是小写的。
JavaScript 使用 Unicode 字符集。
语句：
语句标识符：
语句
描述
break
用于跳出循环。
catch
语句块，在 try 语句块执行出错时执行 catch 语句块。
continue
跳过循环中的一个迭代。
do … while
执行一个语句块，在条件语句为 true 时继续执行该语句块。
for
在条件语句为 true 时，可以将代码块执行指定的次数。
for … in
用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。
function
定义一个函数
if … else
用于基于不同的条件来执行不同的动作。
return
退出函数
switch
用于基于不同的条件来执行不同的动作。
throw
抛出（生成）错误 。
try
实现错误处理，与 catch 一同使用。
var
声明一个变量。
while
当条件语句为 true 时，执行语句块。
事件： HTML 元素中可以添加事件属性，使用 JavaScript 代码来添加 HTML 元素。
or
按钮元素中添加了 onclick 属性：
现在的时间是?
代码将修改自身元素的内容：
现在的时间是?
字符串：
字符串可以是插入到引号中的任何字符。你可以使用单引号或双引号：
var carname = "Volvo XC60";
var carname = 'Volvo XC60';
const name = "RUNOOB";
let letter = name[2];
document.getElementById("demo").innerHTML = letter;
//N
字符串长度：内置属性 length txt.length
x=5+5; //10
y="5"+5; //55
z="Hello"+5; //Hello5
规定： 如果把数字与字符串相加，结果将成为字符串！
转义字符：
代码
输出
’
单引号
“
双引号
\
反斜杠
\n
换行
\r
回车
\t
tab(制表符)
\b
退格符
\f
换页符
var x = "John";
var y = new String("John");
(x === y) // 结果为 false，因为 x 是字符串，y 是对象
=== 为绝对相等，即数据类型与值都必须相等。
模版字符串：
JavaScript 中的模板字符串是一种方便的字符串语法，允许你在字符串中嵌入表达式和变量。
模板字符串使用反引号 “ 作为字符串的定界符分隔的字面量。
模板字面量是用反引号（`）分隔的字面量，允许多行字符串、带嵌入表达式的字符串插值和一种叫带标签的模板的特殊结构。
参数：
string text：将成为模板字面量的一部分的字符串文本。几乎允许所有字符，包括换行符和其他空白字符。但是，除非使用了标签函数，否则无效的转义序列将导致语法错误。
expression：要插入当前位置的表达式，其值被转换为字符串或传递给 tagFunction。
tagFunction：如果指定，将使用模板字符串数组和替换表达式调用它，返回值将成为模板字面量的值。
除了普通字符串外，模板字面量还可以包含占位符——一种由美元符号和大括号分隔的嵌入式表达式：${expression}。字符串和占位符被传递给一个函数（要么是默认函数，要么是自定义函数）。默认函数（当未提供自定义函数时）只执行字符串插值来替换占位符，然后将这些部分拼接到一个字符串中。
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
//toFixed(digit) 四舍五入到小数点后digit位
document.getElementById("demo").innerHTML = total; //Total: 12.50
let header = "Vegetavle";
let tags = ["RUNOOB", "GOOGLE", "TAOBAO"];
let html = `${header} `;
for (const x of tags) {
html += `${x} `;
}
html += ` `;
document.getElementById("demo").innerHTML = html;
Vegetavle
条件运算符： variablename=(condition)?value1:value2
voteable=(age<18)?"年龄太小":"年龄已达到";
本文来自网络，不代表协通编程立场，如若转载，请注明出处：https://www.net2asp.com/9a9a3f8cc4.html
alt 属性用来为图像定义一串预备的可替换的文本。
