目录
二、 交互信息<form name action method>
C语言中文网：C语言程序设计门户网站(入门教程、编程软件) (biancheng.net)
一、展示信息
- 链接 <<a href="https://www.educoder.net" target=”_blank”>Educoder平台</a> > a标签值可是本地文件
- 图像 <img src=”图片地址” width= height= alt="这是--图"/ >注意：img标签是以/>结尾的， 不是 </img>结尾的。
- <body background= bgcolor= text=>
- <p align="center"><font><h1 align="center">
- 列表<ol> <ul> <li>
<li><a href="#toc1">简介</a></li>
<h2 id="toc1">简介</h2>
<p><a href="#">回到顶部</a></p>
- 基本标签<h1>--<h6>
<head>中的标签有<base>, <link>, <meta>, <script>, <style>, 以及 <title>
| 属性 | 值 | 含义
| ------------ | -----------
| id | 自定义的元素id名 | 元素的唯一的id
| class | 自定义的元素类名 | 元素的类名
| style | 元素内联样式 | 元素的样式
| title | 额外信息内容 | 元素的额外信息
属性的先后顺序为： type -- id -- class -- name -- value ，其他需要添加的属性最后写。
id是设置标签的标识，使用方法
class为标签设定一个可以复用的标识，具有同样class的标签就会有相同的特点
二、交互信息<form name action method>
- <input type=”文本框text/密码框password/单选框radio/多选框checkbox 默认选中checked="checked" 不可选中disabled=”disabled”/ 提交按钮submit/reset/hidden/file/img” name= value=>
<label for="user">用户：</label><input type="text" id="user" name="user"/>
点击文本”用户”也能选择表单”text”元素
- <select>
<option value="apple" selected=”selected”>苹果</option>
<option value="orange">橘子</option>
</select>
- 文本域 style中设置高度长度属性，body中可以定义文本区域最大能输入的字符数。
<style>
textarea {width:200px;height:120px; }
</style>
个人描述：<textarea maxlength="10"></textarea>
三、布局
- <table border="2" width height cellpadding=6
cellpadding="10"><caption>表标题</caption>
<tr><td>表格</td></tr> rowspan/colspan
<th>
2、<frameset> <frame>
3、<div>+CSS更加灵活，常用
（内联样式）Inline style > （内部样式）Internal style sheet >（外部样式）External style sheet > 浏览器默认样式
在 HTML 头部（<head>标签内）的<style>标签中定义 CSS 样式，使用内嵌样式表定义的 CSS 样式只能在当前网页内使用，
当单个文档需要特殊的样式时，就应该使用内部样式表。可以使用 <style> 标签在文档头部定义内部样式表
<h1 style="color: maroon; margin-left: 40px">html</h1>
外部样式表是最常见也是最推荐的引用 CSS 的方式，您只需要将 CSS 样式定义在一个 .css 格式的文件中，然后使用 HTML 的<link>标签将这个 .css 格式的样式文件应用到 HTML 文档中。
在 HTML 文档中使用@import时，@import需要定义在<style>标签中。如果<style>标签中还有其它的 CSS 样式，那么@import就必须定义在所有样式的最前面；
- 通用选择器*{} 匹配 HTML 文档中的每个元素。在开发中，我们通常使用通用选择器来清除 HTML 元素中默认的内外边距
* {
margin: 0 auto;//外边距
padding: 0;//内边距
}
- 标签选择器div{}标签选择器可以通过具体的标签名称来匹配文档内所有同名的标签，例如p选择器能够匹配文档中所有的<p>标签。
- class选择器.classname{}类选择器可以根据标签的 class 属性匹配具体的 HTML 标签，所有符合条件的标签都会根据选择器内的样式进行格式化。多个 class 属性值所组成的类选择器我们可以称之为“多类选择器”，而前面介绍的由单个 class 属性值定义的类选择器可以称为“单类选择器”。
- id选择器#name{}ID 选择器用来匹配 HTML 文档中具有指定 ID 属性的标签，#nav选择器能够匹配文档中具有id="nav"属性的标签。
- Content
盒子的主要内容，这些内容可以是文本、图像等资源。内容区有 width、height、overflow 三个属性，其中 width 和 height 属性用来指定盒子内容区域的宽度和高度，当内容信息过多，超出内容区所设置的范围时，则可以使用 overflow 属性设置溢出内容的处理方式，overflow 属性有四个可选值：
hidden：表示隐藏溢出的部分；
visible：表示显示溢出的部分（溢出的部分将显示在盒子外部）；
scroll：表示为内容区添加一个滚动条，您可以通过滑动这个滚动条来查看内容区的全部内容；
auto：表示由浏览器决定如何处理溢出部分。
- Padding 内边距是内容区和边框之间的空间 padding-top、padding-right、padding-bottom、padding-leftt
- border边框是环绕内容区和内边距的边界，您可以使用 border-style、border-width 和 border-color 以及它们的简写属性 border 来设置边框的样式。其中 border-style 属性为边框中最主要的属性，如果没有设置该属性的话，其它的边框属性也会被忽略。
- Margin外边距位于盒子模型的最外围，是边框之外的空间，通过外边距可以使盒子与盒子之间不会紧凑的连接在一起，是 CSS 布局中的一种重要手段。您可以使用 margin-top、margin-bottom、margin-left、margin-right 以及它们的简写属性 margin 来设置各个方向上外边距的宽度。
- 一、语法：弱类型，使用的数据类型没有严格的要求,var 变量，区分大小写,JavaScript 编写的代码不需要编译，可以直接运行,JavaScript 是一种解释型脚本语言,一种面向对象语言，使用 JavaScript 不仅可以创建对象，也能操作使用已有的对象。JavaScript 脚本的执行顺序也是根据 <script> 标签的位置来确定的。
- 二、对话框：alert，confirm，prompt
- 三、事件驱动：onclick
- 四、内置对象 String 对象用于处理字符串，其中提供了大量操作字符串的方法，以及一些属性。
Array数组是值的有序集合，数组中的每个值称为一个元素，每个元素在数组中都有一个数字位置，称为索引，索引从 0 开始，依次递增。在 JavaScript 中，您可以使用 Array 对象定义数组，此外，Array 对象中还提供了各种有关数组的属性和方法。
Date可以访问计算机系统的时间，此外，Date 对象中还提供了多种用于管理、操作和格式化时间/日期的方法。
- 五、浏览器对象
- Window alert(“弹出一个提示对话框”);
- Location .hash
assign() 加载指定的 URL，即载入指定的文档。
reload() 重新加载当前 URL。
replace() 用指定 URL 替换当前的文档，与 assign() 方法不同的是，使用 replace() 替换的新页面不会保存在浏览历史中，用户不能使用后退来返回该页面。
toString() 与 href 属性的效果相同，以字符串的形式返回当前完整的 URL。
- History length 返回浏览历史的数目，包含当前已经加载的页面。
back() 参照当前页面，返回历史记录中的上一条记录（即返回上一页），您也可以通过点击浏览器工具栏中的←按钮来实现同样的效果。
forward() 参照当前页面，前往历史记录中的下一条记录（即前进到下一页），您也可以通过点击浏览器工具栏中的→按钮来实现同样的效果。
go() 参照当前页面，根据给定参数，打开指定的历史记录，
pushState() 向浏览器的历史记录中插入一条新的历史记录。
replaceState() 使用指定的数据、名称和 URL 来替换当前历史记录。
- Document document.write()
- Navigator javaEnabled() 返回浏览器是否支持运行 Java Applet 小程序，支持则返回 true，不支持则返回 false
sendBeacon() 向浏览器异步传输少量数据
- 六、如何定位对象
- 基于name（DOM）
- 基于ID document.getElementById()
- 基于标签 document.getElementsByTagName()
- 基于名字 document.getElementsByName()
- 七、表单验证
用户名、密码不能为空的表单验证
其他一些方法：
background-image: url("https://www.educoder.net/attachments/download/211104");
background-repeat: no-repeat;
background-position: right top;
background-attachment: fixed;
body {
background:#ffffff url("./Assert/sun.jpg") no-repeat right top;
}
使用简写属性时，属性值的顺序为：
background-color；
background-image；
background-repeat；
background-attachment；
background-position。
color，font-family和font-size px/16=em
Font-weight font-style
使用text-decoration设置字体上的文本装饰。
text-align: justify; line-height: 200%;letter-spacing 属性用于控制字符间的间隔多少；word-spacing 属性用于控制字与字的间隔多少。
元素选择器、类选择器和id选择器
在一个 HTML 文档中，可以为任意多个元素指定类，但id选择器只能使用一次，一个id只能运用于一个元素。
一般情况下，都推荐使用类选择器。而在一些特定情况下，我们才会建议使用id选择器。例如，通过id选择器在页面中定义锚，在编写 JavaScript 为指定的页面元素应用特殊行为时。
transform属性用于元素的转换，这个属性允许你将元素进行移动、旋转、拉伸等操作； 默认值为none。translate’的百分比参照自身元素定位居中，可是我要居中的元素没有宽高，是内容撑起来的，那么我无法设置margin值来让他偏移！translate的作用派上了用场！在我设置top、left为50%的时候，设置translate(-50%, -50%)，因为它基于自身宽高度，这样不用计算他的宽高啦
transition属性，它表示从一种样式变为另一种样式效果的过渡“平滑”
transition: all 1s linear 2s;
//
.box p{
transition: all 1s linear 2s;
}
//
.box .pic{
vertical-align: middle;
transition: all 0.8s linear;
}
//
transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。
.box:hover .pic{
transform: scale(1.07);
transform-origin: center center;
}
transform: rotate(720deg);
transform: skewX(-45deg);
rotate3d(x,y,z,angle)
446
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
