HTML标签与浏览器基础-CSDN博客

本文链接：https://blog.csdn.net/weixin_51155543/article/details/115920209

第二次写博客！
这次主要是总结了一些已经学过的HTML标签，以及一些浏览器的知识。

HTML标签

基本格式

!DOCTYPE HTML为HTML5的文档类型声明
html为HTML的根元素
head标签包含了文件的meta元素，title标签，css，js引用等元素
meta charset="utf-8"代表网页编码格式为utf-8
body标签用来编码网页的内容
常用标签
1.图像标签：
src为其必须属性，输入其图片路径
alt属性可以替换文本（当图片不能显示时）
title属性可以提示文本，即鼠标放到图片上时，可以显示文字
2.div 标签和 span 标签

div 和 span 没有语义，是一个盒子，可以用来装内容，一行只能放一个div，但可以放多个span。
3.超链接标签

href属性可以指定链接目标的URL地址，target用于指定链接的页面打开方式，_self为默认值，_blank为在新窗口中打开。链接可分为外部链接，空连接，内部链接，锚点链接和下载链接等。外部链接即与外部网页链接，空链接即没有目标链接，锚点链接可以快速定位到页面的某个位置。
表格标签
1.设置表格的基本标签

效果如下：

在这里插入图片描述

table标签用于定义一个表格，tr标签表示表格中的一行，td标签定义一个tr中有几个单元格，td标签必须嵌套在tr标签中。th标签表示表格中的表头，直接将文字加粗。
修饰表格常用的属性有align,border,celllspacing等等。align属性可以修饰表格的对齐方式，border属性可以修饰表格边框的粗细，celllspacing属性可以修饰两个单元格之间的距离。
2.合并单元格标签
在这里插入图片描述
效果如下（前后对比）
因为截图的问题，两个表格大小不一样在这里插入图片描述
合并单元个有两种方式，跨行合并和跨列合并，上图为跨列合并。
跨列合并需要的属性为colspan，即colspan=“合并的单元格个数”，跨行合并需要rowspan属性，即rowspan=“合并的单元格个数”。而跨行合并的目标单元格为最上侧的单元格，跨列为最左边的单元格。在合并完单元格后，需要将多余的单元格删除。

列表标签
1.无序列表

效果如下

无序列表的各个表项间没有顺序，级别之分，ul标签中只能嵌套li标签，而li标签可以容纳所有元素
2.有序列表

效果如下

有序列表即为有顺序的列表，ol标签中只能嵌套li标签，li标签同样可以容纳所有元素。
3.自定义列表

效果如下

自定义列表中，dl标签用于描述列表，嵌套dt，dd一起使用。dl中只能包含dt和dd，而dt，dd没有个数限制，一般一个dt对应多个dd。
表单标签
1.form标签

form标签用于定义表单，可以实现用户信息的收集和传递。其属性有action,method,name等。action属性用于指定接收并处理表单数据的服务器程序的URL地址，method属性用于设置表单的提交方式，name属性用于指定表单的名称，以便区分同一个页面的多个表单。
2.input表单元素
在这里插入图片描述

input标签中包含一个type属性，type属性有许多不同的值，可以使表格多样化。上图为type属性的一些常用属性值。除了type属性之外，input标签还包含name，value，checked等属性，name和value为每个表单的属性值，主要供后台人员使用，checked属性用于单选按钮和复选框，一打开某个界面，就可以默选某个表单元素。
3.select标签
在这里插入图片描述
效果如下（籍贯项下拉之后有其他选项）

select标签使用户拥有多个选择，形成下拉列表，每个select标签中至少有一对option标签。
4.texterea标签

效果如下

texterea标签可以用于多行输入的情况，通过rows属性和cols属性，可以调整文本框的大小。

浏览器

简介

浏览器是用来检索、展示以及传递Web信息资源的应用程序。现今主流的浏览器有IE、Chrome、Firefox、Safari等等。
浏览器包含地址栏，用于输入网站的地址；菜单栏，包含了浏览器的所有操作与设置功能；选项卡，可以使用多选项卡打开网站的页面；页面窗口，访问的网页内容在这里显示；状态栏，可以实时显示当前的操作和下载Web页面的进度情况。
在这里插入图片描述
chrome浏览器主页