网站招聘方案怎么做,河南省十大互联网企业,网站建设亿玛酷知名,文化建设的名言警句学习链接#xff1a;黑马程序员pink老师前端入门教程#xff0c;零基础必看的h5(html5)css3移动端前端视频教程_哔哩哔哩_bilibili
学习文档#xff1a;
Web 开发技术 | MDN (mozilla.org)
一、前后端工作流程
WEB模型#xff1a;前端用于采集和展示信息#xff0c;中…学习链接黑马程序员pink老师前端入门教程零基础必看的h5(html5)css3移动端前端视频教程_哔哩哔哩_bilibili
学习文档
Web 开发技术 | MDN (mozilla.org)
一、前后端工作流程
WEB模型前端用于采集和展示信息中间的数据请求由后端负责 CS架构客服端-服务器通过APP/软件访问
BS架构浏览器-服务器通过网站访问 浏览器内核用来解析前端代码 二、HTML5CSSJS
1.语言功能
HTML用来搭建页面内容和结构
CSS用来添加样式比如字体颜色大小、背景颜色、字体间距等
JS用来实现网页的行为让页面动起来
2.前端开发工具
常用vscode来开发 3.插件
vscode中可安装一些插件Auto Rename Tag自动修改尾标签会了吧翻译单词
Live Server插件工作原理html文件要放到文件夹里用vscode打开文件夹右键可以在vscode中打开页面修改内容之后保存会在页面实时更新 三、HTML5
1.HTML和XHTML
具有根结构、头结构、体结构标签
HTML的语法较松散可以没有根结构XHTML的语法很严格现有绝大多数还是用HTML 2.注释快捷键ctrl/
!--注释--
3.标签
1语法
所有的指令都需要标签开始标签内容/标签体结束标签元素标签不区分大小写推荐使用小写 2分类
按照标签的结构来分①围堵标签如段落p/p②自闭合标签如水平分割线hr
按照标签效果来分①行内内联标签不会独占一行会和其他标签共享一行。表示斜体
我是em第一名/em
②块级标签会独立成为一行不和其他标签共享一行。
3嵌套
一个标签中可以写另一个标签行内嵌套行内块级嵌套行内块级嵌套块级
行内不可以嵌套块级行内会失效
!--行内嵌套行内--
我是emstrong第一名strong//em
4常见标签
标题标签h1/h1 h2/h2.........字体大小不同
段落标签p/p
4.常规属性有值
1单引号/双引号
属性是作用在标签上的属性不会直接作用在内容上属性值的引号可以省略但不建议
属性的值可以用单引号或者双引号但同类型的引号是不能嵌套的 2以超链接标签为例
href属性表示跳转到哪个网址
title属性给元素添加提示信息鼠标悬停时可以提示内容
target属性_blank 让页面在新的窗口打开_self在当前页面加载默认
可以给图片、标题添加超链接
a hrefhttps://developer.mozilla.org/zh-CN/docs/Web title这是web开发文档 target_blank这是链接/a
5. 布尔属性无值
是属性的一种简化写法常见于表单标签中没有值比如下面的disabled
!--表示输入框不可用--
input typetext disabled 请输入名字
6.实体字符
如何表示html语法中的字符 7.空格的处理
无论写多个空格都会只展示一个空格所以需要用实体字符nbsp;
pMynbsp;nbsp;nbsp;nbsp;cat is very grumpy/p
8.HTML结构
!--!DOCTYPE html 是最短的有效文档声明--
!doctype html
html langzh-CNheadmeta charsetutf-8 /title我的测试站点/title/headbodyp这是我的页面/p/body
/html
meta标签元标签用于指定元数据即网页的描述关键词文件的最后修改时间作者及其他元数据不会显示在客户端。
字符集字符和二进制在计算机中的存储关系英文用ascii中文用gbk通用用utf-8 9.列表可以嵌套
1无序列表
通过属性可以更换前面圆圈的样式嵌套时自动更换图标 2有序列表
通过属性可以更换前面序号的样式嵌套时不会自动更换图标 10.语义化
语义表示该标签的意义比如h1表示一级标题
标签效果给用户看到的效果可以通过css控制样式
任何效果都可以通过控制标签实现所以语义是最重要的 em和i标签都可以表示斜体更推荐使用em因为不止有斜体效果
strong和b标签都可以表示加粗更推荐使用strong因为不止有加粗效果 11.插入图片
插入本地图片或链接指向的图片推荐本地图片 一般不会直接修改图片的大小会糊 12.相对路径和绝对路径
./当前路径 可省略
../上一级路径
13.表格
1结构 2属性与样式
cellspacing设置每个数据边框之间的距离
cellpadding设置数据与边框之间的距离 表头改为th对数据加粗居中
align属性数据居中
bgcolor属性设置背景颜色 3跨行跨列单元格合并 跨列操作 跨行操作 14.表单
作用采集信息