web基础——html

最新推荐文章于 2022-09-07 09:24:49 发布

雖千萬里，吾往矣

最新推荐文章于 2022-09-07 09:24:49 发布

阅读量521

点赞数

分类专栏：信息安全学习之路文章标签： html5 html 网络安全

本文链接：https://blog.youkuaiyun.com/a2562614613/article/details/119987559

版权

信息安全学习之路专栏收录该内容

2 篇文章

订阅专栏

一、B/S架构
B/S架构——Browser/Server架构，是web兴起后的一种网络结构模式，客户端主要是各种类型的浏览器。在这种架构模式下，客户端很少处理事务逻辑，大部分处理是在服务端实现。客户端和服务端的模式采用请求响应的模式。

二、常见的html标签
1、<html> html根标签
2、<head> html头标签
3、<title> 网页标题标签，这里的文字会显示在浏览器的标签栏中
4、<body> 表示html代码主题，bgcolor属性可以设置背景颜色，backgroud = 图片路径，可以设置背景图片
5、<p> 段落标签，可用于内容分段
6、<h1> <h2>标题标签，不同标题标签的字体大小不相同
7、<br>换行标签
8、<hr>水平线，可以添加 color = “red” 属性值来改变水平线的颜色
9、<pre> 预留格式标签，在html中文本是什么格式，浏览器显示出来就是什么格式
10、<b> 加粗
11、<i> 斜体字
12、<ins>插入字体，字体下方有下划线
13、<del>删除字，字体中间有一条横线
14、<sup> 上标，10<sup>2</sup>表示10的平方
15、<sub> 下标
16、<front> 可以用来设置文本的格式，<font color="red" size="12">hello world!</font>
17、<meta charset="utf-8"> 一般用在<head>节点里面，用来告诉浏览器用什么编码格式来解析html文件，默认为GBK
18、  实体符合，表示空格
19、&lt 实体符合，表示小于号
20、&gt 实体符合，表示大于号

三、表格
1、<table> 表格标签，<table border="1px" width="50%" height="200px" align="center">
border属性，设置边框像素
width属性，设置表格宽度，50%表示浏览器页面大小的50%，会根据浏览器页面自动缩放表格大小
height属性，设置表格高度
align属性，设置边框格式为坐对齐、居中、右对齐
2、<tr>：表格的一行
3、<td>：表格的一列，可以使用colspan、rowspan进行行、列的单元格合并
4、<th>：th可以代替td做单元格，th中的内容会自动加粗，会自动居中。
5、<thead>、<tbody>、<tfoot>：可以将表格分成三部分，主要是为了后期javascript提供方便
6、<ul>：无序列表
type属性，表示无序列表每个列表项前的标识符，dics：菱形方块，square：小方块，circle：小圆圈
7、<ol>：有序列表
8、<li>：列表项

四、超链接
1、<img> 图片标签
src属性，用来指定图片路径
width属性，用来指定图片的宽度，高度会等比例缩放，不用手动设置高度
title属性，用来设置鼠标悬停时的提示信息
alt属性，用来指定当图片加载失败时候的提示信息
2、<a> 超链接标签
href属性，用来指定链接的路径
target属性，用来设置链接打开的窗口
_blank：浏览器新窗口
_self：当前窗口
_parent：当前窗口的父窗口
_top：当前窗口的顶级窗口
3、<iframe> 框架标签，在一个窗口中打开另一个窗口

五、表单
1、<form> 表单标签
action属性，这个属性和超链接的href类似，值为某个人url
2、<input>输入标签，输入域，type不同，展示样式不同

button	定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。
checkbox	定义复选框。
file	定义输入字段和 "浏览"按钮，供文件上传。
hidden	定义隐藏的输入字段。
image	定义图像形式的提交按钮。
password	定义密码字段。该字段中的字符被掩码。
radio	定义单选按钮。
reset	定义重置按钮。重置按钮会清除表单中的所有数据。
submit	定义提交按钮。提交按钮会把表单数据发送到服务器。
text	定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。

name属性，浏览器向服务器提交数据的名称，有name的才会提交。没有name是不会提交的。浏览器向服务器提交数据的格式是：
url?name=value&name=value&name=value&name=value&name=value
复选框、单项按钮的value需要相同
submit按钮不能有name，否则也会将自身的值提交给服务器
value属性，浏览器向服务器提交的值，一般text文本框中value的值是用户输入的内容，不需要程序员写明value，但是在选择框等情况下，程序员需要指明value，比如：
<input type="radio" name="sex" value="1" checked />男 
<input type="radio" name="sex" value="0"/>女
checked属性，表示页面默认显示的选项
disabled属性，表示这个选项框只读，但是不会将此条目发送给服务器
readonly属性，表示这个选项框只读，会将此条目发送给服务器
maxlength属性，表示最多输入的字符数量
3、<select> 下拉列表标签
size属性，表示列表一次显示的条目数量
multiple属性，表述下拉列表可以多选
4、<option> 下拉列表的选项标签

六、图层
1、id属性，每一个节点都可以添加id属性，在同一个网页中，id属性是不能重复的id代表了这个节点，id是这个节点的身份证号，后期学习了javascript之后，我们要通过javascript对HTML的节点进行增删改，对节点增删改的时候，需要先获取到该节点对象，id属性可以让我们方便的获取到该节点对象。
2、div和span
        div和span都是图层。（div和span都是盒子），每一个图层在网页当中都是一个独立的盒子。图层的最主要作用就是：网页布局。 table表格同样可以布局，但是table表格布局不灵活，div和span布局更加灵活。
        每一个div和span左上角的顶点，都有x和y轴的坐标，通过这个坐标可以定位div在网页当中的位置。后面讲CSS的时候，我们可以通过CSS样式进行定位。很久以前都是采用table进行布局，现代化的网页都是采用div+span进行布局。
        div和span区别：div默认情况下独自占用1行。 span不会独占行！