html基础笔记

                    html基础
<！DOCTYPE html> 声明html5
还有其他的声明

html标题是通过<h1>-<h6>来定义的
<h1>这是一个标题</h1>

html段落是通过<p>来表示
<p>这是一个段落<p>

html链接
<a href="http://www.baidu.com">这是一个链接</a>

html图像通过<img>来定义
<img loading="lazy" src="/images/logo.png" width="255" height="39" />

                   html元素
第一个标签是开始标签如<P>        中间的内容被称为元素内容   后面一个是结束标签</P>
1. 一些标签的使用，切记所有标签都需要闭合，不管是单体标签还是成对标签。（尽管目前浏览器是识别有些标签不闭合的情况，但是取的最好的保证兼容性，使用闭合）
2. 标签写法要用小写字母（有些版本对大小写可认为相同，而xhtml中强制使用小写）

                   html属性

<a href="http://www.runoob.com">这是一个链接</a>       这就是一个属性实例，包含了href属性
详细参考html属性参考手册https://www.runoob.com/tags/html-reference.html

                   html文本格式化标签
<b>    定义粗体文本
<em>    定义着重文字
<i>    定义斜体字
<small>    定义小号字
<strong>    定义加重语气
<sub>    定义下标字
<sup>    定义上标字
<ins>    定义插入字
<del>    定义删除字

<code>    定义计算机代码
<kbd>    定义键盘码
<samp>    定义计算机代码样本
<var>    定义变量
<pre>    定义预格式文本

<abbr>    定义缩写
<address>    定义地址
<bdo>    定义文字方向
<blockquote>    定义长的引用
<q>    定义短的引用语
<cite>    定义引用、引证
<dfn>    定义一个定义项目。


                   html头部

HTML <base> 元素
<base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
<head>
<base href="http://www.runoob.com/images/" target="_blank">
</head>

HTML <link> 元素
<link> 标签定义了文档与外部资源之间的关系。
<link> 标签通常用于链接到样式表:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

HTML <style> 元素
<style> 标签定义了HTML文档的样式文件引用地址.
在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:
<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>

HTML <meta> 元素
meta标签描述了一些基本的元数据。
<meta> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。
META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。
元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。
<meta> 一般放置于 <head> 区域
<meta> 标签- 使用实例
为搜索引擎定义关键词:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:
<meta name="description" content="免费 Web & 编程教程">
定义网页作者:
<meta name="author" content="Runoob">
每30秒钟刷新当前页面:
<meta http-equiv="refresh" content="30">

               html表格
               TML 表格
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

<table border="1">
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

               html区块
HTML 分组标签
标签    描述
<div>    定义了文档的区域，块级 (block-level)
<span>    用来组合文档中的行内元素，内联元素(inline)

           html表单
           文本域通过<input type="text"> 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域。：
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>

           密码字段通过标签<input type="password"> 来定义:
<form>
Password: <input type="password" name="pwd">
</form>

           <input type="radio"> 标签定义了表单单选框选项
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

           <input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>

           <input type="submit"> 定义了提交按钮.
当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。:
<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>

其他表单标签
<form>    定义供用户输入的表单
<input>    定义输入域
<textarea>    定义文本域 (一个多行的输入控件)
<label>    定义了 <input> 元素的标签，一般为输入标题
<fieldset>    定义了一组相关的表单元素，并使用外框包含起来
<legend>    定义了 <fieldset> 元素的标题
<select>    定义了下拉选项列表
<optgroup>    定义选项组
<option>    定义下拉列表中的选项
<button>    定义一个点击按钮
<datalist>    指定一个预先定义的输入控件选项列表
<keygen>   定义了表单的密钥对生成器字段
<output>   定义一个计算结果

posted @ 2021-08-10 21:16 fak1r26 阅读(54) 评论(0) 收藏举报

刷新页面返回顶部

fak1r2

html基础笔记

公告