HTML笔记

黑客V1

于 2024-03-14 21:11:10 发布

阅读量952

点赞数 15

文章标签： html

本文链接：https://blog.csdn.net/2302_79556885/article/details/136722208

版权

#<!DOCTYPE html> <meta charset="utf-8">meta定义了元数据

#<a href="http://baibu.com"></a><a# href="document.pdf" download>下载文档</a>

target（可选）：指定链接如何在浏览器中打开。常见的值包括 _blank（在新标签或窗口中打开链接）和 _self（在当前标签或窗口中打开链接）。

<a>来设置超文本链接

#<hr/> 标签在 HTML 页面中创建水平线。

1到6号标题与1到6号字体逆序对应，比如1号字体对应6号标题，2号字体对应5号标题。

#<#font size="6">这是6号字体文本</font> 这是下标和上标

这个
段落
演示了分行的效果

<#big>这个文本字体放大</big><small></small>

此例演示如何使用 pre 标签
对空行和    空格
进行控制

在普通段落里一个空格和回车是被省略的（多个空格不省略）

<code> 标签是一个短语标签，用来定义计算机代码文本。

每30秒钟刷新当前页面:

 <meta http-equiv="refresh" content="30">

HTML <link> 元素

style="...."

我们可以使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式:

使用 text-align（文字对齐）属性指定文本的水平与垂直对齐方式：

内部样式表

当单个文件需要特别样式时，就可以使用内部样式表。你可以在<head> 部分通过 <style>标签定义内部样式表:

 <head>
 <style type="text/css">
 body {background-color:yellow;}
 p {color:blue;}
 </style>
 </head>

外部样式表

当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。

 <head>
 <link rel="stylesheet" type="text/css" href="mystyle.css">
 </head>

定义图像的语法是：

URL 指存储图像的位置。如果名为 "pulpit.jpg" 的图像位于 www.runoob.com 的 images 目录中，那么其 URL 为 http://www.runoob.com/images/pulpit.jpg。

alt 属性用来为图像定义一串预备的可替换的文本。在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息

HTML 表格由 <table> 标签来定义。

HTML 表格是一种用于展示结构化数据的标记语言元素。

每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义），表格可以包含标题行（<th>）用于定义列的标题。

tr：tr 是 table row 的缩写，表示表格的一行。
td：td 是 table data 的缩写，表示表格的数据单元格。
th：th 是 table header的缩写，表示表格的表头单元格

HTML无序列表

无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。

无序列表使用 <ul> 标签

Coffee
Milk

HTML 有序列表

同样，有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

列表项使用数字来标记。

Coffee
Milk

HTML 自定义列表

自定义列表不仅仅是一列项目，而是项目及其注释的组合。

自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。

Coffee

- black hot drink

Milk

- white cold drink

ul是unordered lists的缩写 (无序列表)

li是list item的缩写（列表项目）

ol是ordered lists的缩写（有序列表）

dl是definition lists的英文缩写 (自定义列表)

dt是definition term的缩写 (自定义列表组)

dd是definition description的缩写（自定义列表描述）

nl是navigation lists的英文缩写（导航列表）

tr是table row的缩写（表格中的一行）

th是table header cell的缩写（表格中的表头）

td是table data cell的缩写（表格中的一个单元格）

HTML <div> <span> 元素

#<div>定义了文档的区域，块级 (block-level)

#<span>用来组合文档中的行内元素，内联元素(inline)

是块级元素，它独占一行，可以设置宽度、高度以及边距等样式属性。它适合用于创建页面的大块结构，例如页面的主体区域、容器、布局等。
<span> 是行内元素，它不会独占一行，宽度默认由其内容决定。它适合用于对文本或其他行内元素进行样式化、标记或包裹。

默认样式和布局：

元素的默认样式为块级显示，会以块的形式占据可用空间。
<span> 元素的默认样式为行内显示，它不会独占一行，只占据其内容的宽度。

嵌套关系：

可以容纳其他块级元素和行内元素，包括其他的
和元素。
<span> 通常被用来包裹文本或其他行内元素，比如用来设置特定文本的样式。

总之，<div> 用于创建页面结构和布局，而 <span> 用于对文本或行内元素进行样式化或包裹。它们在页面设计和样式设置中有不同的用途和作用。

`<form>` 元素用于创建表单，`action` 属性定义了表单数据提交的目标 URL，`method` 属性定义了提交数据的 HTTP 方法（这里使用的是 "post"）。

<label> 元素用于为表单元素添加标签，提高可访问性。

<input> 元素是最常用的表单元素之一，它可以创建文本输入框、密码框、单选按钮、复选框等。type 属性定义了输入框的类型，id 属性用于关联 <label> 元素，name 属性用于标识表单字段。

<select> 元素用于创建下拉列表，而 <option> 元素用于定义下拉列表中的选项。

text-align:center left right justify char 文字对齐方式

margin-top -right -bottom -left（顺时针）

margin:10px;(上下左右各10px) margin:10px 50px;(上下10px,左右50px)

margin:10px 50px 60px(上10px 左右50px 下60px)

margin:0 auto (第一个表示top bottom，第二个表示left right)居中