前端随堂笔录2

5.28
链接标签
<a href>
核心属性就是href 属性值可以是一个跳转的地址
适用于任何带有路径的东西
href；里面的内容就是路径
绝对路径：从盘符开始，然后依次往下查找
绝对路径分为本地和服务器
本地：C：Users/Administrator/0527day01/07.html
服务器：https://www.baidu.com/
192.168.1.1 / 127.0.0.1
www.baidu.com
相对路径：从当前文件开始，如果下一级目录就直接写文件夹，上一级用...表示
盘符根路径：可以直接跳转到当前文件所有的盘符根目录中 “/”
服务器底下
本地底下

图像标签
img 是我们接触的第一个行内块标签
行内块标签可以设置一行内的宽和高 不能设置居中对齐 只能靠左或靠右。

src 图片的路径
alt 当图片显示不出来的时候才会显示
图片正在下载的时候...加载中
图片的路径错误的时候
width 图片宽
height 图片高
align 设置对齐

前端和后端之间的通信
1.form提交方式
2.ajax提交方式
核心标签：只有提交的功能，没有任何的样式
form属性：
action 提交的地址，通常为服务端的地址，如果不写，默认往本地提交
method 提交的方式，get/post 如果不写为get提交

input button 都是行内块标签 只能设置一行的内容
input是表单的核心标签，通过修改input标签中的type属性来改变展现的样式
地址？后面的内容表示参数，我们最终的目的是要把必须的参数给发送到后端想要发送参数，input中必须含有name属
性 name="username" name="userpwd"

每一个组里都必须含有相同的name属性值
input中的值有一个属性，value属性 可作优化
checked 默认选项，当属性名等于属性值的时候，只需要写属性名即可 就是必须要选中一个
type中checkbox 多选框
radio 单选框
select 下拉框
textarea 文本区域

css的学习
html 结构，承载内容
css 样式 层叠样式表
JavaScript 行为

css的使用方式（）
1.行内样式 (内联样式)
2.页面嵌入（内部样式表）
3.外部文件（外部样式表）
4.外部导入样式
css语法：（符号都是英文的）
选择器{
属性名1:属性值1；
属性名2:属性值2；
...
}

1.行内样式（内联样式）
<标签style="属性名1:属性值1；属性名2:属性值2；..."></标签>

2.页面嵌入（内部样式表）
在head标签里面增加一个子标签
<style>
选择器{
属性名1:属性值1；
属性名2:属性值2；
...
}
</style>

3.外部文件（外部样式表）
在head标签里面增加一个子标签
<link rel="stylesheet" href="css文件的路径" />

4.外部导入样式
主要用在样式初始化。因为有一些标签有自己的样式，我们需要清空，方便自己计算

css------选择器
ID选择器
使用id选择器：在元素上面增加一个id属性,id属性的属性值不用用数字开头
一个页面中只能有一个id属性值
css中id选择的表示方法用 # 表示
class选择器
使用class选择器：在元素上增加一个class属性，class属性的属性值不能用数字开头
一个页面中可以有多个class属性值
css中class选择器的表示方法用 . 表示
标签选择器 直接写标签名
组合选择器 选择器直接用,分隔开即可
子代选择器 > 只针对子代
后代选择器 用空格表示，包含着子代选择器
通用选择器 * 针对于所有的标签

<style type="text/css">
规定文档是文本类型和CSS类型
<div class="div02" id="div02" style=" 10px;height: 10px; background-color: #000;">今天天气很好
</div>
里面设置的宽和高就直接是内联样式

选择器是有权重的
内联样式 1000
id 100
class 10
元素 1
通用 0
boss !important 只要出现，就以这个为主


权重越高，冲突部分的样式就以权重高的为主，并不是说这个选择器没有用了，而是里面冲突的样式
权重仅仅只能作为参考
权重的计算
不需要管子代和后代的
如果权重相同，就近原则。以后定义的为准

text-align: right; 文本对其方式
text-decoration: underline; 文本下划线
color: #f00; 设置字体的颜色
line-height: 166.67px; 文本的行高
一行文字所占的高度,让他上下居中

font-family: "Microsoft YaHei"; 设置字体的样式:宋体，楷体... 去百度，翻译中英文
font-family: "宋体"; 自己去百度找到宋体对应的英文，节约空间
font-style: italic; 规定字体是否倾斜
font-weight: bold;
font-size: 16px ; 设置字体的大小
在浏览器中,默认的字体大小16px
谷歌浏览器中，字体大小最小可以为12px
火狐没有限制

.div01:hover{ /*10+10*/ hover 叫伪类选择器
background-color: #ff0; 当你的鼠标放上去的时候，会变化成别的样子
}
权值 10

cursor: none; /*设置鼠标的样式*/
display: block; /*元素分为三大类,设置元素的显示方式
行内 inline
块级 block
行内块 inline-block
none 无

有序列表和无序列表在实际开发中基本不用
<ul></ul> <ol></ol> <li></li>
都是块级标签

opacity: 0.1; 取值的范围是0-1之间，可以为0和1
background-color: rgba(255,0,0,0.1); 最后一个参数a表示透明度，取值的范围是0-1之间，可以为0和1

border="n"属性：是对表格中的边框的粗糙进行设置，n代表的是粗细。
witdth="700px" :表示单元格的宽度
height="500" :表示单元格的高度
align="center" :表示对齐方式，center表示居中对齐
<table border="1px" width="700px" height="500px" align="center">
这句话表示的是表格中的边框粗细为1 宽700 高500 居中对齐
2.table中的标签
<caption>我的标题</caption>：表示的是表格中的标题的标签
<tr>:表示行标签
<td>:表示列标签
<p>:段落标签
<ul>:列表标签
<li>:列表标签

JS跳转大概有以下几种方式：

第一种：(跳转到b.html)
<script language="javascript" type="text/javascript">
window.location.href="b.html";
</script>
第二种：（返回上一页面）
<script language="javascript">
window.history.back(-1);
</script>
第三种：
<script language="javascript">
window.navigate("b.html");
</script>
第四种：
<script language="JavaScript">
self.location=’b.html’;
</script>
第五种：
<script language="javascript">
top.location=’b.html’;
</script>