学习html的day1
c:client 客户端
b:browser 浏览器
s:server 服务器
C/S架构 和B/S架构
c/s架构:即 Client/Server(客户机/服务器)结构,通过将任务合理分配到 Client 端和Server 端,降低了系统的通讯开销,可充分利用两端硬件环境优势。早期软件系统多以此作为首选设计标准。
b/s架构:即 Browser/Server(浏览器/服务器)结构,是随着 Internet 技术的兴起,对C/S 结构的一种变化或者改进的结构。在这种结构下,用户界面完全通过 WWW 浏览器实现,一部分事务逻辑在前端实现,但是主要事务逻辑在服务器端实现,节约了开发成本,便于软件维护。
区别:
1、C/S 是建立在局域网的基础上的。B/S 是建立在广域网的基础上的,但并不是说 B/S结构不能在局域网上使用。
2、B/S 业务扩展简单方便,通过增加页面即可增加服务器功能。C/S 的客户端还需要安装专用的客户端软件,不利于扩展。
3、B/S 维护简单方便。开发、维护等几乎所有工作也都集中在服务器端,当企业对网络应用进行升级时,只需更新服务器端的软件就可以,这减轻了异地用户系统维护与升级的成本。
4、B/S 响应速度不及 C/S;
5、B/S 用户体验效果不是很理想。
html
—超文本标记语言
超:超链接,能从一个网页跳转到 另一个网页
<开始标签>标签体(neirong)</结束标签>
标签可以嵌套
html的骨架:
<html>
<head>
</head>
<body>
</body>
</html>
例:<marquee loop="1">我是做的第一个网页<input disabled/> </marquee>
UTF-8:万国码,包含世界上所有文字与符号
注意:存储时,选对字符编码,否则数据会无法存储并丢失
存储与读取方式必须采用一致的,否则会乱码
属性名=“属性值”
属性名=“属性值”
当属性名与属性值相同时,只写属性名
title是网页标签名
标题标签
一共六个h1到h6
1—>6越来越小,独占一行
段落标签和换行标签
在HTML中,你可以使用不同的标签来对文本进行格式化和样式设置。以下是一些常用的文本格式化标签:
<strong>:用于强调文本,通常以加粗的形式显示。例如:<strong>加粗文本</strong>。
<em><i>:用于强调文本,通常以斜体的形式显示。例如:<em>斜体文本</em>。
<u><ins>:用于给文本添加下划线。例如:<u>下划线文本</u>。
<s><del>:用于给文本添加删除线(表示删除或过时的文本)。例如:<s>删除线文本</s>。
<sub>:用于创建下标文本,通常用于数学公式或化学公式。例如:H<sub>2</sub>O。
<sup>:用于创建上标文本,通常用于数学公式或化学公式。例如:x<sup>2</sup>。
code:用于表示代码或计算机代码。例如:console.log(“Hello, World!”);。
无语义标签
div
<!-- 容器,独占一行 多用于布局-->
<div>
einceioeu
</div>
span
一行可存在多个东西
<!-- span一行可存在多个 -->
<span>a</span>
<span>a</span>
<span>a</span>
图片标签
img src=" " :引号里是指向图片的地址
alt=“” :引号里是图片地址发生错误时用来提示的字
title=“ ” :引号里是鼠标放在上面时出现的文字
width 是宽度
height 是高度
单位是px像素
borger:边框宽度
视频标签
video src=" " :引号里是视频文件地址
controls :控件
autoplay :自动播放
muted :静音播放
loop :循环播放,如果后面加上数值,表示循环的次数,例如:loop="5"表示循环5次
preload :auto(预先加载视频)none(不应加载视频)
poster :等待视频加载时的显示图片
音频标签
audio src=" " :引号里是音频所在的地址
链接标签
<a href=" (链接的地址) " target=_blank"> (链接所处地)
锚链接
例:<a href="#one">个人经历</a>
<div id="one">个人经历</div>
有序列表
<ol type=" "> -------->type的值表示以什么开头,默认是以1开头,也可以是a或者A
<li>需要排序的内容<li>
......
</ol>
例:
<!--有序列表 ol li -->
喜欢的食物
<ol>
<li>红烧肉</li>
<li>臭豆腐</li>
<li>西红柿炒鸡蛋</li>
</ol>
无序列表
<ul type=" "> -------->type的值表示排序前面的形状,circle表示空心圆,disc表示实心圆点,square表示方形点
<li>需要排序的内容<li>
.....
</ul>
例:
喜欢的明星
<ul>
<li>蔡徐坤</li>
<li>林恒</li>
<li>徐必成</li>
</ul>
自定义列表
例:<dl>
<dt>
你们喜欢的明星是?
<dd>
蔡徐坤
</dd>
<dd>
林恒
</dd>
<dd>
徐必成
</dd>
</dt>
</dl>
iframe框架
例:<a href="https://www.taobao.com" target="nn">去淘宝</a>
<iframe name="nn" frameborder="0" width="800px" height="200px"></iframe>
特殊字符
例:<div>
<
>
<br />
我最喜欢的食物是 冰淇淋
31°
</div>
原代码 | 显示结果 | 描述 |
---|---|---|
<; | < | 小于号或显示标记 |
>; | > | 大于号或显示标记 |
&; | & | 可用于显示其它特殊字符 |
"; | “ | 引号 |
®; | ® | 已注册 |
&trade; | ™ | 商标 |
&ensp; | 半个空白位 | |
&emsp; | 一个空白位 | |
 ; | 不断行的空白 |
|
| ®; | ® | 已注册 |
| &trade; | ™ | 商标 |
| &ensp; | | 半个空白位 |
| &emsp; | | 一个空白位 |
|  ; | | 不断行的空白 |