黑马程序员技术交流社区

标题: 【石家庄校区】学习总结 [打印本页]

作者: 王晓艺 时间: 2019-6-1 14:47
标题: 【石家庄校区】学习总结
前端：

一、web

1. web概念概述
- javaweb：
 使用java语言开发基于互联网的项目
- 软件架构：
 - C/S：Client/Server 客户端/服务器端
 - 在用户本地有一个客户端程序，在远程有一个服务器端程序。
 - 如：QQ，迅雷...
 - 优点：
 1. 用户体验好
 - 缺点：
 1. 开发、安装、部署、维护麻烦
- B/S：Browser/Server 浏览器/服务器端
 - 只需要一个浏览器，用户通过不同的网址(URL)，可以访问远程不同的服务器端程序
 - 优点：
 1. 开发、安装、部署、维护简单
 - 缺点：
 1. 如果应用过大，用户的体验可能会受到影响
 2. 对硬件要求过高
1. B/S架构详解
- 资源分类：
 1. 静态资源
 - 使用静态网页开发技术开发的资源
 - 特点：
 - 所有用户访问，得到的结果是一样的。
 - 如：文本、图片、音频、视频，HTML、CSS、JavaScript
 - 如果用户请求的是静态资源，那么服务器会直接将静态资源发送给浏览器。浏览器中内置了静态资源的解析引擎，可以展示静态资源
 2. 动态资源
 - 使用动态网页及时发布的资源
 - 特点：
 - 所有用户访问，得到的结果可能不一样
 - 如：jsp/servlet，php，asp...
 - 如果用户请求的是动态资源，那么服务器会执行动态资源，转换为静态资源，再发送给浏览器
- 我们要学习动态资源，必须要学习静态资源！
- 静态资源：
 - HTML：用于搭建基础网页，展示页面的内容
 - CSS：用于美化页面，布局页面
 - JavaScript：控制页面的元素，让页面有一些动态的效果

二、HTML

1. 概念：是最基础的网页开发语言
- Hyper Text Markup Language 超文本标记语言
 1. 超文本
 - 超文本是用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本。
 2. 标记语言
 - 由标签构成的语言。<标签名称>
 - 如：html，xml.....
 - 标记语言不是编程语言
2. 快速入门：
- 语法：
 1. html文档后缀名 . html 或者 . htm
 2. 标签分为
 1. 围堵标签：有开始标签和结束标签。
 - 如：<htm;>
 2. 自闭和标签：开始标签和结束标签在一起。
 - 如： 
 3. 标签可以嵌套：
 需要正确嵌套，不能你中有我，我中有你
 错误的：<a></a>
 正确的：<a></a>
 4. 在开始标签中可以定义属性。属性是由键值对构成，值需要用引号(单引号、双引号都可以，要么全单引号，要么全双引号)引起来
 5. html的标签不区分大小写，但是建议使用小写。
3. 标签学习：
1. 文件标签：构成html最基本的标签
 - html： html文档的根标签
 - head：头标签。用于指定html文档的一些属性。引入一些外部的资源。
 - title：定义标题标签。
 - body：体标签
 - <!DOCTYPE html>： html5中定义该文档是html文档
2. 文本标签：和文本有关的标签
 - 注释：
 - 标题标签：<h1> to <h6>
 - h1 ~ h6 ：字体大小逐渐递减
 - 段落标签：
 - 换行标签： 
 - 展示一条水平线：<hr />
 - 属性：
 - color：颜色
 - width：宽度
 - size：高度
 - align：对齐方式
 - center：居中
 - left：左对齐
 - right：右对齐
 - 字体加粗：
 - 字体斜体：
 - 字体标签：
 - 属性：
 - color：字体颜色
 - size：字体大小
 - face：字体
 - 居中标签：<center>
 - 属性定义：
 - color：
 1. 英文单词：red，green，blue......
 2. rgb(值1，值2，值3)：值的范围：0~255
 - 如：rgb(0,0,255)
 3. (# 值1，值2，值3)：值的范围：00~FF之间。
 - 如：# FF00FF
 - width：
 1. 数值：width = '20'，数值的单位，默认是 px(像素)
 2. 数值%：占比相对于父元素的比例
3. 图片标签：
 - <img />：展示图片
 - 属性：
 - src：指定图片的位置
 - 相对路径：
 - 以 . 开头的路径
 1. . / ：代表当前目录
 - 如：. / image/1 . jpg
 2. . . / ：代表上一级目录
 - 如： . . / image/ 1 . jpg
4. 列表标签：
 - 有序列表：
 - ol：
 - li
 - 如：
 - <ol>
 <li></li>
 </ol>
 - 属性：
 - type：规定列表的类型
 - start：规定列表中的起始点
 - 无序列表
 - ul：
 - li
 - 如：
 - <ul>
 <li></li>
 </ul>
 - 属性：
 - type：规定列表的项目符号类型
 - disc：实心园点
 - square：实心方块
 - circle：空心圆点
 - 注意：列表项的编号都不建议使用html属性修改

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2