web的三大标准:
(1)html 结构标准
(2)css 表现(样式标准)
(3)js 行为标准
标准的分类:
公共的属性:
(1)id:
身份证 一个页面中只有一个唯一的id
<p id = 'aaa'>文字1</p>
<p class = 'aaa'>文字2</p>
<p class = 'aaa'>文字2</p>
<p class = 'aaa'>文字2</p>
css选择器:
*{
通配符选择器
}
标签选择器
div{
}
id选择器
#aaa{
color:red
}
类选择器
.aaa{
}
(2)class:
(3)title: ***
鼠标悬浮到内容显示的标题
(1)行内标签
a属性:
href:链接网络资源或者本地资源地址
target:
_self:默认的在本页打开网址
_blank:在空白页面打开新的网址
span:
strong
em
i
img:行内块
属性:
src:链接的图片资源(本地图片资源或者cdn)
alt:图片加载失败的时候显示的文本
(2)块级标签:
div:
division 分割
作用:分页面中的每块区域
p:
段落标签:
p标签内部只能放行内(span,a,img,input)的标签,不能放块标签
ul:
它的孩子只能是li
li
ol
dl
dt
dd
特点:
(1)行内标签:
1.在一行内显示
2.不能设置宽高,默认是字体的大小
(2)块级标签:
1.独占一行
2.可以设置宽高,如果不设置宽 默认是父亲的100%的宽度
(3)行内块标签:(img,input)
1.在一行内显示
2.可以设置宽高
标签嵌套的问题
文档 index.html
html
head body
今日内容:
(1)table表格标签
table:设置border:'1'属性,单元格带边框的效果
style="border-collapse:collapse;" 表格中很细表格边线的制作:
tr:每行
td:每行单元格的数据
(2)form表单标签:
action:提交的地址
method:提交的方式
get:不安全
post:相对安全
input表单控件:
type:
text: 明文显示用户输入的数据
password 密文显示用户输入的数据
radio单选按钮
checkbox:复选框
file:上传文件所用
submit:功能固定化,负责将表中中的表单控件提交给服务端
value:控件的值既要提交给服务器的数据
name:控件的名称,服务端用
disabled:该属性只要出现在标签中,表示的是禁用该控件
注意:如果有文件需要提交给服务器,method必须为POST,enctype必须为multipart/form-data
https://www.processon.com/view/link/5ad1c2d0e4b0b74a6dd64f3c
状态码简单介绍:
200以上:表示成功请求的状态码
300以上: 缓存
400以上: 404 网页加载失败 前端出错
500以上: 后端逻辑出错,后端业务逻辑出错
(3)css的作用:修饰页面的结构,让页面好看
(1)css的引入方式
1.行内样式
<div style='color:red;'></div>
2.内接样式
3.外接样式
外接式
导入式
(2)基础选择器
id选择器:
#app
类选择器:
.app
它选择的是共性,而不是特性
标签选择器:
div
通配符选择器
总结:
不要去试图用一个类将我们的页面写完。这个标签要携带多个类,共同设置样式
每个类要尽可能的小,有公共的概念,能够让更多的标签使用
玩好了类 就等于玩好了css中的1/2
到底使用id还是用class?
答案:尽可能的用class。除非一些特殊情况可以用id
原因:id一般是用在js的。也就是说 js是通过id来获取到标签
(3)高级选择器
后代选择器:
选中的是儿子 孙子.....
子代选择器
并集选择器
交集选择器