前端
HTML(语言)
CSS(语言)
JavaScript(JS)或JSP(淘汰了)
要求:能用就行,不追求美观度
后台
JavaEE
JDBC
JSON(特殊格式的字符串)
前端学习什么
是什么
网页 游戏 手机APP
有啥用
1,收集信息 2,展示信息 3,与用户沟通
怎么学
步骤:
1,搭建开发环境
要求:电脑上有浏览器就行
2,开发工具
VSCode
HBuilder(中文)
创建项目
步骤:
项目管理器,点击鼠标右键-选择新建-选择web项目-填写项目名与存储位置
项目结构:
项目名
css(文件夹):存放前端项目使用的css文件
img(文件夹):存放前端项目使用的图片文件
js(文件夹):存放前端项目使用的js文件
index.html:项目中自带的网页文件
注意:一个项目中可以有多个网页文件
3,学习语言
学习Html基本结构
<html>
<head></head>
<body></body>
</html>
head中的标签
meta 设置当前网页编码格式为utf-8,作用防止中文乱码
title 网页标题
body中的标签
文本标签
font
span标签被用来组合文档中的行内元素
h1~h6标题
属性: align:内容在标签中的位置 居中 居左 居右left:左边 center:左右中间 right:右边
p段落标签
属性: align:内容在标签中的位置 left:左边 center:左右中间 right:右边
big字体变大
b
加粗
i 斜
img 图片
属性: src:显示的资源文件,可以使用相对路径,也可以使用绝对路径与网址
width:宽 定值:xxxpx
百分比:10%,占父容器宽度的百分数若<x001><x002> </x002></x001>xxx01就是xxx02的父容器
height:高 定值
超链接
a
属性 href 跳转的位置地址
锚点 :跳转的a标签 注意:a标签的内容区可以容纳别的标签也可以放文本
输入
标签名:input
属性:
type:输入类型 text 可见 password 不可见
text:账号输入(搜索框)
password:密码输入
button:按钮
radio:单选按钮
name属性值相同则为一组
checkbox:多选按钮
name属性值相同则为一组
range:进度条
file:文件选择
date:日期选择
submit:提交,一般在form表单中使用
reset:重置,一般在form表单中使用
placeholder:提示字
value:值
name:名称
form:表单
action:结束数据的后端接口
method:提交方式
get:提交少量不重要数据,主要用于获取数据
post:提交重要数据
其他标签
br:换行
hr:水平分割线
div:块
ul:无序列表 子项:li
ol:有序列表 子项:li
select:选择器 子项:option
媒体
注意:兼容性不好
音频:audio
属性: src:播放的资源地址
controls:控制台
loop:循环播放
autoplay:自动部分
注意:当属性名与属性值相同时,可以忽略属性值不写
视频:video
属性: src:播放的资源地址
controls:控制台
loop:循环播放
autoplay:自动部分
注意:当属性名与属性值相同时,可以忽略属性值不写
表格标签
table:表格
tr:行
td:单元格
作业
使用html完成一下内容
1,编写出师表,要求可以回到顶部,显示的内容有文章标题,作者,正文,作者头像.点击作者头像可以跳转 到百度百科诸葛亮介绍
2,使用表格标签完成调查问卷表 表中至少要有10个题,包含单选与多选,有按钮用于提交 如: 姓名 性别 口味 菜系 主食 ...
3,使用完成登录注册页