HTML和CSS 学习笔记-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_42512266/article/details/100261483

JavaWeb:
使用Java语言开发基于互联网的项目

软件架构：
1.C / S: client / server 客户端 / 服务器端
在用户本地有一个客户端，在远程有一个服务器端程序
如:qq 腾讯
优点：用户体验好
缺点：开发、安装、部署、维护麻烦
2.B / S: browser / server 浏览器 / 服务器端
只需一个浏览器，用户通过不同的网址（URL），客户访问不同的服务器端程序
优点：开发、安装、部署、维护简单
缺点：1.如果应用过大，用户的体验可能收到影响 2. 对硬件要求高

B/S架构详解
资源分类：
1. 静态资源：
使用静态网页开发技术发布的资源。
特点：
所有用户访问，得到的结果是一样的。
如：文本、图片、音频、视频，HTML，CSS，JavaScript
如果用户请求的是静态资源，那么服务器会直接将静态资源发送给浏览器。浏览器中内置了静态资源的解析引擎，可以展示静态资源
2. 动态资源：
使用动态网页技术发布的资源。
特点：
所有用户访问，得到的结果可能不同。
如：jsp / servlet，PHP，asp…
如果用户请求的是动态资源，那么服务器会执行动态资源，转换为静态资源，再发送给浏览器。

我们要学习动态资源，必须先学习静态资源！

静态资源：
HTML：用于搭建基础网页，展示页面的内容
CSS：用于美化页面，布局页面
javascript：控制页面的元素，让页面有一些动态的效果

HTML

概念：是最基础的网页开发语言
hyper text markup language 超文本标记语言
超文本：
超文本使用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本。
标记语言：
由标签构成的语言。<标签名称> 如HTML是标签语言，xml
标记语言不是编程语言
2.快速入门：
语法：
1.html文档后缀名 .html或者 .htm
2.标签分为：
①围堵标签：有开始标签和结束标签。如
②自闭和标签：开始标签和结束标签在一起。如换行标签
```
  	3. 标签可以嵌套：
  	     需要正确嵌套，不能你中有我，我中有你
  	     错误：<a><b></a></b>
  	     正确：<a><b></b></a>

  	4.在开始标签中可以定义属性。属性使用键值对构成，值需要用引号(单双都可)引起来
  	5.html的标签不区分大小写，建议小写
```

代码：

<html>

	<head>
		<title>title</title>
	</head>
	
	<body>
		<font color='red'> Hello World  </font><br/>

		<font color='green'> Hello World  </font>

	</body>
</html>

标签学习：
1.文件标签：构成html最基本的标签
HTML标签:html文档的根标签
head：头标签。用于指定HTML文档的一些属性。引入外部的资源
title：标题标签。
boby：体标签
<! DOCTYPE html> 定义文档类型
2.文本标签：和文本有关的标签

3.图片标签：
4.列表标签：
有序列表：
ol:
li:
无序列表：
ul:
li:
5.链接标签：
a:定义一个超链接
属性：
href:指定访问资源的URL(统一资源定位符)
target:指定打开资源的方式
_self：默认值，在当前页面打开
_blank:在空白页面打开
6.div和span：span：文本信息在一行展示行内标签内联标签
div:每个div占满一整行。块级标签
7.语义化标签：

HTML5为了提高程序的可读性，提供了一些标签

8.表格标签：
table定义表格
-width：宽度
-border：边框
-cellpadding：定义内容与单元格的距离
-cellspacing：定义单元格之间的距离。如果指定为0，则单元格的线会合为一条
-bgcoloor：表格的背景色
-align： center 居中对齐对齐方式
tr定义行
td定义单元格
```
 		colspan:和并列
 		rowspan:合并行
 th定义表头单元格
 <caption> :表格标题
 <thead> : 表示表格的头部分
 <tbody> : 表示表格的体部分
 <tfootg>: 表示表格的脚部分
```