Linux网络编程-9.HTML,CSS基础

9.1 HTML

http://www.w3school.com.cn/html/index.asp
http://www.runoob.com/
HTML简介

  • HTML,Hyper Texture Markup Language,超文本标记语言
  • 在计算机中以.html、.htm作为扩展名
  • 可以被浏览器访问, 就是经常见到的网页

HTML特点

  • 语法非常简洁、比较松散,以相应的英语单词关键字进行组合
  • html标签不区分大小写
  • 大多数标签是成对出现的, 有开始, 有结束
    • <html></html>
  • 不成对出现的称之为短标签
    • <br/> <hr/>

标签中的属性和属性值

  • 属性=“属性值”
    • <font color="red">hello, world</font>
    • 属性值建议加引号, (双, 单引号, 不加都可以)

9.2 HTML组成部分

<!doctype html>声明文档类型
<html>文档的头部好和主体内容</html>根标记
<head> 文档的头部信息</head>头部标记 只能有一对
<title>显示在浏览器窗口的标题栏中“网页名称”</title>位于
<head>标记之内
<body></body>主体标记位于<html>之内,<head>标记之后

示例:

<html>
<head>
<title>这是一个标题</title>
</head>
<body>
<font color="red" size="5">hello, world</font>
</body>
分区 web服务器 的第 1 页
</body>
</html>

9.2.1 注释

<!-- 这是一个html注释 -->

9.2.2 标题标签

<h1>最大标题</h1>

  • 只有一个
  • 搜引擎优化:seo

<h2> </h2>

<h6>最小标签</h6>
1~6依次变小,自动换行

9.2.3 文本标签

<font></font>

  • 属性:
    • color:文字颜色
      • 表示方式:
        – 英文单词:redgreenblue
        – 使用16进制的形式表示颜色:#ffffff
        – 使用rgb(255,255,255)
    • size:文字大小
      – 范围:1(min)~7(max)

9.2.4 文本格式化标签

文本加粗标签

  • <strong> </strong>
  • <b> </b>
  • 尽量使用strong

文本倾斜标签

  • <em> </em>
  • <i> </i>
  • 尽量使用em

删除线标签

  • <del> </del>
  • <s></s>
  • 尽量使用del

下划线

  • <ins></ins>
  • <u></u>
  • 尽量使用ins

9.2.5 段落

<p>xxx</p>

  • 特点:上下自动生成空白行

9.2.6 块容器

<div>block</div>
用于定义没有语义含义的内容的块级容器(或网页的“划分”)
属性:对其方式

  • align
    • left
    • center
    • right

9.2.7 列表

9.2.7.1 无序列表
<ul><li></li> <!-- 列表项 --><li></li>
</ul>
<!--
属性:type实心圆圈:disc(默认)空心圆圈:circle小方块:square
-->
9.2.7.2 有序列表
<ol><li></li> <!-- 列表项 --><li></li>
</ol>
<!--
属性:type:序号1:默认aAi:罗马数字(小)I:罗马数字(大)start从序号的什么位置开始
-->

9.2.8 自定义标签

<dl><dt></dt> <!-- 小标题 --><dd></dd> <!-- 解释标题 --><dd></dd> <!-- 解释标题 -->
</dl>

9.2.9 图片标签

<img src="3.gif" alt="小岳岳" title="我的天呐!" width="300" height="200" />
<!-- 
属性:src: 图片的来源 必写属性alt: 替换文本 图片不显示的时候显示的文字title: 提示文本 鼠标放到图片上显示的文字width: 图片宽度height: 图片高度
注意:图片没有定义宽高的时候,图片按照百分之百比例显示如果只更改图片的宽度或者高度,图片等比例缩放。
-->

9.2.10 超链接

 <a href="http://jd.com" title="A dog" target="_blank">超链接</a>
<!--
属性:
href: 去往的路径(跳转的页面)必写属性
title: 提示文本, 鼠标放到链接上显示的文字
target
_self: 默认值 在自身页面打开(关闭自身页面,打开链接页面)
_blank: 打开新页面 (自身页面不关闭,打开一个新的链接页面)
-->
示例:<a href="http://www.baidu.com">百度一下</a>
锚链接
先定义一个锚点: <p id="sd">
超链接到锚点: <a herf="#sd">回到顶点</a>

9.2.11 表格

<table></table>
<!--
属性:border -- 表格线, 宽度1-7bordercolor -- 表格线颜色widthheight
-->
<tr> <!-- 行 -->
<!--
属性align -- 对齐方式centerleftright
-->
<td> <!-- 单元格(列) -->
<!--
对其属性设置同tr
-->
示例:
<table border=1>
<tr>
<td></td> <!-- 第一列 -->
<td></td> <!-- 第二列 -->
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</tr>
</table>

9.2.12 其他

<br />:换行
<hr />:水平线

  • 属性:
    • color:三种
    • size:1-7
    • <hr color="red" size="3">

9.3 http协议

9.3.1 请求消息

浏览器给服务器发
四部分: 请求行, 请求头, 空行, 请求数据

  • 请求行: 说明请求类型, 要访问的资源, 以及使用的http版本
  • 请求头: 说明服务器要使用的附加信息
  • 空行: 空行是必须要有的, 即使没有请求数据
  • 请求数据: 也叫主体, 可以添加任意的其他数据

请求头:由键值对构成的

例:

GET /3.txt HTTP/1.1\r\n// /: 资源目录的根目录// 三部分内容由空格间隔
Host: localhost:2222
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:24.0) Gecko/201001 01
Firefox/24.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: zh-cn,zh;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
If-Modified-Since: Fri, 18 Jul 2014 08:36:36 GMT// 请求数据

9.3.2 响应消息

服务器给浏览器发
四部分: 状态行, 消息报头, 空行, 响应正文

  • 状态行: 包括http协议版本号, 状态码, 状态信息
  • 消息报头: 说明客户端要使用的一些附加信息
  • 空行: 空行是必须要有的
  • 响应正文: 服务器返回给客户端的文本信息

例:

HTTP/1.1 200 Ok
Server: micro_httpd
Date: Fri, 18 Jul 2014 14:34:26 GMT
Content-Type: text/plain; charset=iso-8859-1 (必选项)// 告诉浏览器发送的数据是什么类型
Content-Length: 32// 发送的数据的长度
Content-Language: zh-CN
Last-Modified: Fri, 18 Jul 2014 08:36:36 GMT
Connection: close#include <stdio.h>
int main(void)
{printf("hello world!\n");return 0;
}

9.3.3 HTTP1.1的五种请求方式

GET

  • 请求指定的页面信息,并返回实体主体。

POST

  • 向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。数据被包含在请求体中。POST请求可能会导致新的资源的建立和/或已有资源的修改。

HEAD

  • 类似于get请求,只不过返回的响应中没有具体的内容,用于获取报头

PUT

  • 从客户端向服务器传送的数据取代指定的文档的内容。

DELETE

  • 请求服务器删除指定的页面。

CONNECT

  • HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。

OPTIONS

  • 允许客户端查看服务器的性能。

TRACE

  • 回显服务器收到的请求,主要用于测试或诊断。

9.3.4 HTTP常用的状态码

状态代码有三位数字组成,第一个数字定义了响应的类别,共分五种类别:

  • 1xx:指示信息–表示请求已接收,继续处理
  • 2xx:成功–表示请求已被成功接收、理解、接受
  • 3xx:重定向–要完成请求必须进行更进一步的操作
  • 4xx:客户端错误–请求有语法错误或请求无法实现
  • 5xx:服务器端错误–服务器未能实现合法的请求

常见状态码:

  • 200 OK 客户端请求成功
  • 400 Bad Request 客户端请求有语法错误,不能被服务器所理解
  • 401 Unauthorized 请求未经授权,这个状态代码必须和WWW-Authenticate报头域一起使用
  • 403 Forbidden 服务器收到请求,但是拒绝提供服务
  • 404 Not Found 请求资源不存在,eg:输入了错误的URL
  • 500 Internal Server Error 服务器发生不可预期的错误
  • 503 Server Unavailable 服务器当前不能处理客户端的请求,一段时间后可能恢复正常

9.3.5 http中的文件类型

普通文件: text/plain; charset=utf-8
*.html
: text/html; charset=utf-8
*.jpg : image/jpeg
*.gif : image/gif
*.png
: image/png
*.wav
: audio/wav
*.avi : video/x-msvideo
*.mov
: video/quicktime
*.mp3
: audio/mpeg

charset=iso-8859-1

  • 西欧的编码,说明网站采用的编码是英文;

charset=gb2312

  • 说明网站采用的编码是简体中文;

charset=utf-8

  • 代表世界通用的语言编码;可以用到中文、韩文、日文等世界上所有语言编码上

charset=euc-kr

  • 说明网站采用的编码是韩文;

charset=big5

  • 说明网站采用的编码是繁体中文;

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/664025.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[SWPUCTF 2021 新生赛]easy_md5

用get给name 用post给password 二个值不相等MD5相等 可以通过php的弱类型绕过 $a!$b md5($a)md5($b)找到不同 a 和 a和 a和b&#xff0c;两者的md5值均为0e开头的形式

Open3D 深度图像转点云

目录 一、算法原理1、算法过程2、主要函数3、算法源码二、代码实现三、结果展示1、深度图像2、点云四、测试数据

MACos虚拟机安装全过程

MACos虚拟机安装全过程 一、前言 随着多平台工作和软件兼容性需求的增加&#xff0c;虚拟机成为了许多人的必备工具。在Mac OS上使用虚拟机&#xff0c;可以让你在单一的操作系统上运行其他操作系统&#xff0c;如Windows、Linux等。本篇文章将详细介绍如何在Mac OS上安装虚拟…

LSTR: 基于Transformer的车道形状预测

LSTR: 基于Transformer的车道形状预测 项目背景与意义LSTR的特性和功能最新更新即将推出的功能模型资源库数据准备设置环境训练和评估引用许可证贡献致谢 在计算机视觉领域&#xff0c;车道检测是自动驾驶和智能交通系统中的关键技术之一。我们推出了一种名为LSTR的车道形状预测…

DNS 服务器类型比较:如何选择合适的 DNS 配置

介绍 DNS&#xff0c;即域名系统&#xff0c;是系统在互联网上进行通信时连接的一个重要部分。没有了DNS&#xff0c;计算机和使用它们的人将只能使用称为IP地址的数字地址进行连接。 除了需要记住大量复杂数字地址的明显问题外&#xff0c;通过IP地址进行通信还会引发一些额…

mysql 锁知识汇总

目录 一、锁1.1 什么是锁&#xff1f;1.2 全局锁1.2.1 定义1.2.2 应用场景1.2.3 会出现的问题1.2.4 解决方法 1.3 表级锁1.3.1 表锁1.3.2 元数据锁&#xff08;MDL&#xff09;1.3.3 意向锁1.3.4 AUTO-INC锁 1.4 行级锁1.4.1 记录锁(Record Lock)1.4.2 间隙锁(Gap Lock)1.4.3 N…

【C++11】包装器

包装器 一、function包装器1、function包装器介绍2、包装示例3、function包装器统一类型4、function包装器简化代码5、function包装器的意义 二、bind包装器1、bind包装器介绍&#xff08;1&#xff09;bind包装器&#xff08;2&#xff09;调用bind的一般形式 2、bind包装器绑…

vite和vue-cli实现原理和优化及区别

Vite&#xff1a; 1. 实现原理&#xff1a; Vite 是一个基于 ESModule 的构建工具。它利用原生 ESModule 的特性&#xff0c;将每个文件作为一个模块&#xff0c;通过浏览器去解析和执行&#xff0c;而不需要提前将文件打包成一个单独的 bundle。Vite 利用浏览器的原生 ESMod…

LeetCode 热题 100 | 链表(中上)

目录 1 141. 环形链表 1.1 哈希表 1.2 快慢指针 2 142. 环形链表 II 2.1 哈希表 2.2 快慢指针 3 21. 合并两个有序链表 4 2. 两数相加 菜鸟做题第三周&#xff0c;语言是 C 1 141. 环形链表 1.1 哈希表 解题思路&#xff1a;遍历链表&#xff0c;在哈希表中…

Linux下grep命令详解

grep #文件内容过滤显示 #在指定的普通文件中查找并显示含有指定字符串的行&#xff0c;也可与管道符一起使用格式&#xff1a; grep-参数 查找条件 文件名 参数&#xff1a; 示例&#xff1a; [rootnode1 ~]# grep -n "root" /etc/passwd # -n&a…

Flink 添加 / 部署 Jar 包的若干注意事项

Flink 添加 / 部署 Jar 包可根据 Jar 包的声明周期、作用范围选择不同的附属方式&#xff0c;从实际应用上来看&#xff0c;可以分成以下几种场景&#xff1a; 普遍使用的框架或基础设施级别的 Jar 包&#xff0c;例如 Kafka、Hive、Hudi 等 Connector 的Jar 包&#xff0c;应…

Vue3学习记录(一)--- 组合式API之基础概念和变量声明

一、组合式API基础 1、简介 ​ 组合式 API (Composition API) 是Vue3和Vue2的v2.7之后版本中的全新特性&#xff0c;是一系列API的的集合&#xff08;响应式API、生命周期钩子、依赖注入等等&#xff09;&#xff0c;其风格是基于函数的组合&#xff0c;以一种更直观、更灵活…

【Unity3D小技巧】Unity3D中UI控制解决方案

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址我的个人博客 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 在开发中总是会控制UI界面&#xff0c;如何优雅的控制UI界面是…

02-Java抽象工厂模式 ( Abstract Factory Pattern )

抽象工厂模式&#xff08;Abstract Factory Pattern&#xff09;是围绕一个超级工厂创建其他工厂 该超级工厂又称为其他工厂的工厂 在抽象工厂模式中&#xff0c;接口是负责创建一个相关对象的工厂&#xff0c;不需要显式指定它们的类 每个生成的工厂都能按照工厂模式提供对象 …

CDS view与替代对象

一&#xff0c;简介 替代对象是指用一个CDS view指派给一个透明表或常规数据库视图&#xff0c;使得透明表或常规数据库视图的访问重定向到该CDS view。 替代有诸多要求&#xff1a; 字段数量一致且同名对应&#xff0c;顺序可以不一致对应的字段数据类型长度等必须一致CDS v…

在Linux下搭建自己的私有maven库并部署和发布自定义jar依赖和自定义maven插件(三)开发和发布自己开发的maven插件

系列文章目录 在Linux下搭建自己的私有maven库并部署和发布自定义jar依赖和自定义maven插件(二)发布自己开发的jar包 文章目录 系列文章目录在Linux下搭建自己的私有maven库并部署和发布自定义jar依赖和自定义maven插件(二)发布自己开发的jar包 前言一、插件需求二、maven自定…

H5调用安卓原生相机API案例

1、在activity_main.xml文件里添加webview标签 <WebViewandroid:id="@+id/webview"android:layout_width="match_parent"android:layout_height="match_parent"> </WebView> 2、AndroidManifest.xml(权限和活动声明) 开启访问…

如何准备明年游戏行业春招

大学校园招聘一般分春招和秋招。对于很多即将毕业的同学来说&#xff0c;如果秋招时没有收获合适的offer&#xff0c;那么春招就是最后的求职机会。此时更应珍惜&#xff0c;全力以赴。 许多游戏大厂通常会在校招开放基础岗位&#xff0c;这是进入游戏公司的捷径。校招时你的主…

前端JavaScript篇之对 rest 参数的理解、ES6中模板语法与字符串处理

目录 对 rest 参数的理解ES6中模板语法与字符串处理 对 rest 参数的理解 rest参数是一种在函数定义中使用的特殊语法&#xff0c;它允许函数接受任意数量的参数&#xff0c;并将它们收集到一个数组中。通俗地说&#xff0c;rest参数就像是一个容器&#xff0c;用来存放函数接收…

2024/2/2

第一章 命名空间 一&#xff0e;选择题 1、编写C程序一般需经过的几个步骤依次是&#xff08; B &#xff09; A. 编辑、调试、编译、连接 B. 编辑、编译、连接、运行 C. 编译、调试、编辑、连接 D. 编译、编辑、连接、运行 2、所谓数据封装就是将一组数据和与这组数据有关操…