html常用基础标签

LibraFree

已于 2022-10-08 23:39:45 修改

阅读量993

点赞数 2

分类专栏：前端篇文章标签： html css 前端

于 2022-09-01 15:25:35 首次发布

本文链接：https://blog.csdn.net/qq_51670115/article/details/126532667

版权

前端篇专栏收录该内容

8 篇文章 1 订阅

订阅专栏

html简介

HTML，全称“Hyper Text Markup Language（超文本标记语言）” 。
HTML 称为超文本标记语言，是一种标识性的语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的 Internet 资源连接为一个逻辑整体。HTML 文本是由 HTML 命令组成的描述性文本，HTML 命令可以说明文字，图形、动画、声音、表格、链接等。

页面架构

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		
	</body>
</html>

html基本的标签

head标签

<title> 定义网页的标题

<meta> 定义网页的基本信息，比如针对搜索引擎和更新频度的描述和关键词

<style> 定义css样式

<link> 定义文档与外部资源的关系，链接外部css文件或脚本文件

<script> 定义脚本语言，引入js文件

<base> 定义页面所有链接的基础定位

body标签

段落与文字

<h1><h1>~<h6><h6> 标题（header）

<p> 段落（paragraph）

<br> 换行（break）

<hr> 水平线（horizontal rule）

<div> 分割 [块元素]（divsion）

<span> 区域[行内元素]（span）

块元素：<h1>~<h6>,p,hr,div

特点：
1. 独占一行，排斥其他元素与其同一行，包块块元素与行内元素。
2. 块元素内部可以容纳其他块元素或行元素。
行内元素：<strong>,<em>,<span>

特点：
1. 可以与其他行内元素同一行。
2. 行内内部可以容纳其他行内元素，但不可以容纳块元素。
标签分类：一般标签：有开始符号和结束符号（有始有终） <body><body>

自闭合标签：只有开始符号没有结束符号<br/>

文本格式化标签

<strong>加粗</strong>

<strong> 字体加粗

<b></b>加粗

<i></i>斜体

<u></u> 下划线

<sup></sup>上标

<sub></sub>下标

<del></del> 删除线

<font></font> 规定字体属性

<pre></pre>代码样式原样输出

cite 引用

列表

`<ol>` 有序列表（ordered list）

type值属性：1 数字1，2，3

a 小写字母a，b，c

A 大写字母A, B, C

i 小写罗马数字

I 大写罗马数字

`<ul>` 无序列表（unordered list）

type值属性：disc 默认值，实心原点

circle 空心圆

square 实心正方形

`<dl>` 定义列表（definition list）

<dl> 定义列表（definition list) :定义列表的开始和结束

<dt> 定义名词（definition term) ：后面添加要解释的名词

<dd> 定义描述 (definition description) ：后面添加该名词的具体描述

列表内放 <li> 标签：列表项（list ltem)

表格

表格基本标签

<table> 表格

<tr> 表格行（table row）

<td> 表格单元格（table data）

<caption>我的标题</caption>:表格带标题
border 边框
width 宽度
height 高度
colspan 行
rowspan 竖
cellpadding 单元边与内容的空白
cellspacing 单元格的空白

表格基本结构

<thead> 表头

<tbody> 表身

<tfoot> 表教

<th> 表头单元格（table header）

在表格钟，合并行，合并列也是我们常用的方法。

form表单

form表单：规定当提交表单时向何处发送表单数据 method 提交的方法有 get、post，规定在发送表单数据之前如何对其进行编码。

enctype值

application/x-www-form-urlencoded:在发送前编码所有字符（默认）
multipart/form-data:不对字符编码,在使用包含文件上传控件的表单时，必须使用该值。
text/plain:空格转换为 “+” 加号，但不对特殊字符编码。

input 表单

name：同样是表示的该文本输入框名称。
size：输入框的长度大小。
maxlength：输入框中允许输入字符的最大数。
value：输入框中的默认值
readonly：表示该框中只能显示，不能添加修改。

type属性值：

text：单行文本框
1. password：密码文本框
  1. button：按钮
  2. reset：重置按钮
  3. image：图像形式的提交按钮
  4. radio：单选按钮
  5. checkbok：复选按钮、
  6. gidden：隐藏字段
  7. files：文件上传
  8. <textarea rows="行数" cols="列数">多行文本框内容</textarea> : 多行文本框

图像标签

img 常用属性

<src> 图像的文件地址

<alt> 图片显示不出来时的提示文字

<title> 鼠标移动到图片的提示文字

width 规定图片的高度
height 规定图片的宽度

相对路径：引用的文件位置是相对当前文件的位置而言
绝对路径：指的是文件的完整路径
图片格式：
1. jpg ：可以较好的处理大面积色调的图像
2. png：图片体积小，可以无损压缩
3. gitf：图像效果较差，可以制作动画

链接

超链接使用a标签

a标签的作用：就是用于控制界面与页面之间的跳转

<a href="链接地址" target="目标窗口的打开方式">

target属性值：
1. _self：默认方式，当前窗口打开链接。
2. _blank: 在一个新窗口中打开链接
3. _top: 在顶层框架中打开链接
4. _parent: 在当前框架的上一层里打开链接

音频

插入音频

<embed src="多媒体文件地址" width="播放界面的宽度" height="播放界面的高度"></embed>

插入背景音乐

<bgsound src="背景音乐的地址"/>

loop="2"表示重复2次，loop="infinite"或者loop="-1"表示无限次循环播放

LibraFree

关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
打赏
0
评论
html常用基础标签

html简介，html基本的标签，head标签，body标签，段落与文字，文本格式化标签列表, 有序列表，无序列表，定义列表，表格基本标签，表格基本结构，图像标签，img，常用属性,链接,超链接使用a标签,form表单,input 表单,音频,插入音频：插入背景音乐...
复制链接

扫一扫