01 - HTML

1.1 B/S 软件的结构

在这里插入图片描述

1.2 前端的开发流程

在这里插入图片描述

1.3 网页的组成部分

页面由三个部分内容组成:①内容(结构);②表现;③行为

内容(结构):是我们在页面中可以看到的数据,我们称之为内容。一般内容,我们使用 html 技术来展示。
表现:指的是这些内容在页面上的展现形式。比如说 布局、颜色、大小等等。一把按使用 CSS 技术实现。
行为:指的是页面中元素与输入设备交互的响应。一般使用 JavaScript 技术实现。

1.4 HTML 简介

Hyper Text Markup Language(超文本标记语言)简写:HTML

HTML 通过标签来标记要显示的网页中的各个部分。网页本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器,如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)

1.5 创建 HTML 文件

  1. 创建一个 web 工程(静态的 web 工程)
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
  2. 在工程下创建 html 页面
    在这里插入图片描述
    选择浏览器执行页面
    在这里插入图片描述
    第一个 html 实例:
    在这里插入图片描述
    :Java 文件是需要先编译,再由 Java 虚拟机跑起来。但 HTML 文件不需要编译,直接由浏览器进行解析执行。

1.6 HTML 文件的书写规范

在这里插入图片描述
html的代码注释:<!-- 这是 html 的注释,可以在页面中右键查看源代码中看到 -->

:在 markdown 编辑器中 HTML 的注释内容会不可见!

1.7 HTML 标签介绍

  1. 标签的格式:
    <标签名>封装的数据</标签名>
  2. 标签名大小写不敏感。
  3. 标签拥有自己的属性。
    • 基本属性bgcolor=“red”(可以修改简单的样式效果)
    • 事件属性οnclick=“alert(‘你好!’);”(可以直接设置事件响应后的代码)
  4. 标签又分为,单标签和双标签。
    • 单标签格式:<标签名/>(br 换行、hr 水平线)
    • 双标签格式:<标签名>…封装的数据…</标签名>
      在这里插入图片描述

标签的语法:

  1. 标签不能嵌套
  2. 标签必须正确关闭
  3. 属性必须有值,属性值必须加引号
  4. 注释不能嵌套
    注意:html 代码不是很严谨。有时候标签不闭合,也不会报错。

1.8 常用标签介绍

1.8.1 font 字体标签

需求1:在网页上显示“我是字体标签”,并改字体为宋体,颜色为红色
在这里插入图片描述

1.8.2 特殊字符

需求1:把 <br> 换行标签 变成文本 转换字符显示在页面上。
常用特殊字符表:
在这里插入图片描述
其他特殊字符表:
在这里插入图片描述

1.8.3 标题标签

标题标签是 h1 到 h6
需求1:演示标题1 到标题6
在这里插入图片描述

1.8.4 超链接(*重点)

需求1:普通的超链接
在这里插入图片描述

1.8.5 列表标签

①无序列表;②有序列表

需求1:使用无序列表把东北 F4 :赵四、刘能、小沈阳、宋小宝展示出来
在这里插入图片描述

1.8.6 img 标签

img 标签可以在 html 页面上显示图片

需求1:使用 img 标签显示一张美女的照片,并修改宽高,和边框属性
在这里插入图片描述
在这里插入图片描述

1.8.7 表格标签(*重点)

需求1:做一个 带表头的,三行三列的表格,并显示边框
需求2:修改表格的宽度,高度,表格的对齐方式,单元格间距
在这里插入图片描述

1.8.8 跨行跨列表格(*次重点)

需求1:新建一个五行五列的表格,第一行,第一列 的单元格要跨两行,第二行的第一列的单元格要跨两行,第四行第四列的单元格跨两行两列
在这里插入图片描述
在这里插入图片描述

1.8.9 了解 iframe 的框架标签(内嵌窗口)

iframe 标签可以在一个 html 页面上,打开一个小窗口,去加载一个单独的页面
在这里插入图片描述

1.8.10 表单标签

什么是表单?
表单就是 html 页面中,用来收集洪湖信息的所有元素集合。然后把这些信息发送给服务器。
在这里插入图片描述
需求1:创建一个个人信息注册的表单界面。包含用户名、密码、确认密码。性别、爱好、国籍。自我评价。重置,提交
在这里插入图片描述
:此实现没有关注 表单的格式提交细节

表单的提交细节
在这里插入图片描述

1.8.11 其他标签

需求1:div、span、p 标签的演示
在这里插入图片描述

展开阅读全文

Git 实用技巧

11-24
这几年越来越多的开发团队使用了Git,掌握Git的使用已经越来越重要,已经是一个开发者必备的一项技能;但很多人在刚开始学习Git的时候会遇到很多疑问,比如之前使用过SVN的开发者想不通Git提交代码为什么需要先commit然后再去push,而不是一条命令一次性搞定; 更多的开发者对Git已经入门,不过在遇到一些代码冲突、需要恢复Git代码时候就不知所措,这个时候哪些对 Git掌握得比较好的少数人,就像团队中的神一样,在队友遇到 Git 相关的问题的时候用各种流利的操作来帮助队友于水火。 我去年刚加入新团队,发现一些同事对Git的常规操作没太大问题,但对Git的理解还是比较生疏,比如说分支和分支之间的关联关系、合并代码时候的冲突解决、提交代码前未拉取新代码导致冲突问题的处理等,我在协助处理这些问题的时候也记录各种问题的解决办法,希望整理后通过教程帮助到更多对Git操作进阶的开发者。 本期教程学习方法分为“掌握基础——稳步进阶——熟悉协作”三个层次。从掌握基础的 Git的推送和拉取开始,以案例进行演示,分析每一个步骤的操作方式和原理,从理解Git 工具的操作到学会代码存储结构、演示不同场景下Git遇到问题的不同处理方案。循序渐进让同学们掌握Git工具在团队协作中的整体协作流程。 在教程中会通过大量案例进行分析,案例会模拟在工作中遇到的问题,从最基础的代码提交和拉取、代码冲突解决、代码仓库的数据维护、Git服务端搭建等。为了让同学们容易理解,对Git简单易懂,文章中详细记录了详细的操作步骤,提供大量演示截图和解析。在教程的最后部分,会从提升团队整体效率的角度对Git工具进行讲解,包括规范操作、Gitlab的搭建、钩子事件的应用等。 为了让同学们可以利用碎片化时间来灵活学习,在教程文章中大程度降低了上下文的依赖,让大家可以在工作之余进行学习与实战,并同时掌握里面涉及的Git不常见操作的相关知识,理解Git工具在工作遇到的问题解决思路和方法,相信一定会对大家的前端技能进阶大有帮助。
©️2020 CSDN 皮肤主题: 技术黑板 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值