HTML 学习笔记

最新推荐文章于 2024-07-25 00:55:07 发布
最新推荐文章于 2024-07-25 00:55:07 发布
阅读量836 收藏 20
点赞数 6
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/baiguang1234/article/details/140214252
版权

常用标签元素：

<html>

<head>：头

<head> <meta charset="utf-8">

<title>文档标题</title> </head>

<h>:标题，一共有6级（h1-h6）heading的缩写

<p>:段落，paragraph

<br>:换行

<b>:加粗

<i>:斜体

<sub>:下标

<sup>：上标

<a>：超链接,通过属性href=“url”指定连接，anchor的缩写，

  • href：指定链接目标的URL，这是链接的最重要属性。可以是另一个网页的URL、文件的URL或其他资源的URL。
  • target（可选）：指定链接如何在浏览器中打开。常见的值包括 _blank（在新标签或窗口中打开链接）和 _self（在当前标签或窗口中打开链接）。
  • title（可选）：提供链接的额外信息，通常在鼠标悬停在链接上时显示为工具提示。
  • rel（可选）：指定与链接目标的关系，如 nofollow、noopener 等。

<table>： 里面有<tr>,<td>等

<ul>:无序列表，里面有<li>元素

<ol>:有序列表，里面有<li>元素

<div>: 定义了文档的区域，块级元素

<span>:用来组合文档中的行内元素，内联元素（inline）

网页布局：

<div> 布局示例：

<div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">主要的网页标题</h1></div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>菜单</b><br>
HTML<br>
CSS<br>
JavaScript</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
内容在这里</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
版权 © runoob.com</div>

</div>

表单的示例：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

    <h2>表单</h2>

    <form action="/" method="post">
        <!-- 文本输入框 -->
        <label for="name">用户名:</label>
        <input type="text" id="name" name="name" required>

        <br>

        <!-- 密码输入框 -->
        <label for="password">密码:</label>
        <input type="password" id="password" name="password" required>

        <br>

        <!-- 单选按钮 -->
        <label>性别:</label>
        <input type="radio" id="male" name="gender" value="male" checked>
        <label for="male">男</label>
        <input type="radio" id="female" name="gender" value="female">
        <label for="female">女</label>

        <br>

        <!-- 复选框 -->
        <input type="checkbox" id="subscribe" name="subscribe" checked>
        <label for="subscribe">订阅推送信息</label>

        <br>

        <!-- 下拉列表 -->
        <label for="country">国家:</label>
        <select id="country" name="country">
            <option value="cn">CN</option>
            <option value="usa">USA</option>
            <option value="uk">UK</option>
        </select>

        <br>

        <!-- 提交按钮 -->
        <input type="submit" value="提交">
    </form>

</body>
</html>

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

说明：学习来自w3school

baiguang1234
关注
  • 6
    点赞
  • 踩
  • 20
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML5学习笔记
m0_61721166的博客
03-08 8927
一、网页 1.什么是网页 网站是指在因特网上根据一定的规则，使用 HTML等制作的用于展示特定内容相关的网页集合。 网页是网站中的一“页” ，通常是 HTML 格式的文件，它要通过浏览器来阅读。 网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以.htm或.html 后缀结尾的文件，因此将其俗称为HTML文件。 2.什么是HTML HTML指的是超文本标记语言(HyperTextMarkupLanguage)，它是用来描述网页的一种语言。HTML不
HTML学习笔记
m0_58761900的博客
09-16 2493
6.表格标签：table 可以给table加属性： border：加边框 th：加表头 width/height：控制高度宽度 cellspcing：去掉单元格空隙 cellpadding：内容距边框的距离，默认是1像素 align：表格相对于周围元素的对齐方式，比如align=“center” 7.列表标签： （1）无序列表：ul li （2）有序列表：ol li （3）自定义列表：dl（总标签）、dt（小标题）、dd（围绕标题来说明） 8.表单标签：form
【HTML】HTML学习笔记（全）
热门推荐
Bitdancing的专栏
12-09 1万+
前端HTML学习笔记大全
HTML学习笔记(全)
weixin_63676550的博客
01-12 5631
HTML学习笔记 视频教程：https://b23.tv/LbTHmRE
前端之HTML学习笔记一
m0_53211178的博客
02-28 8169
目录 1.网页 1.1网页的概念 1.2HTML的概念 1.3网页的形成 2.常用的浏览器 3.web标准 3.1为什么需要web标准 3.2web标准的构成（重点） 1.网页 1.网页 1.1网页的概念 网站是指在因特网上根据一定的规则，使用HTML等制作的用于展示特定内容相关的网页集合。 网页是网站中的一"页"，通常是HTML格式的文件，它要通过浏览器来阅读。 网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成，通常我们看到的网页，常见以.htm或.
HTML学习笔记pdf版
07-19
HTML 学习笔记简介 1. 概述 HTML（HyperText Markup Language，超文本标记语言）是用于创建和结构化网页内容的标准语言。它定义了网页中的各种元素和其布局方式，包括文本、图像、链接、表格等。 2. 基本结构 ...
html学习笔记
06-22
1.属性，hidden 属性是布尔属性。 注释：在 XHTML 中，属性简写是禁止的，hidden 属性必须定义为 。2.事件
基于 HTML+ECharts 实现的大数据可视化平台模板（含源码）
柯晓楠
07-24 3243
大数据的可视化对于企业决策、市场分析和业务洞察至关重要。通过直观的数据展示，团队可以快速理解复杂的数据模式，发现潜在的业务机会。本文将详细介绍如何利用 HTML 和 ECharts 实现一个功能丰富的大数据可视化平台模板。
ASP.NET 生成分页 HTML 函数示例
一个九零后程序猿开发日志
07-24 210
函数会生成一个包含上一页、页码和下一页的 HTML 分页导航。
【HTML — 构建网络】HTML 入门
07-24 1150
如果您查看许多其他站点的代码，您可能会遇到许多奇怪的标记样式，包括不带引号的属性值。在这一点上，你应该了解 HTML 是什么样子的，以及它在基本层面上是如何工作的。在 HTML 中，不需要在 void 元素标记的末尾添加 a，例如： .但是，它也是一种有效的语法，当您希望 HTML 是有效的 XML 时，您可以这样做。现在，您可以在 Web 浏览器中打开此文件，以查看呈现的代码的外观。在本练习中，您可以如前所述在计算机上本地编辑代码，也可以在下面的示例窗口中编辑代码（在本例中，可编辑示例窗口仅表示。
如何在Html界面内实现类似ChatGpt的打字效果
ioioppk的博客
07-23 297
在你的代码中添加打字机效果，你可以创建一个函数来逐字展示内容。这个函数会将内容分解成单个字符，然后逐渐显示在页面上。
HTML 基础知识
07-24 987
你写的替代文本应该为读者提供足够的信息，以便对图像传达的内容有一个很好的了解。对于我们的Firefox徽标，一个更好的替代品是“Firefox徽标：围绕地球的火焰狐狸”。如果它们如上所示重叠，那么您的 Web 浏览器将尝试对您想说的内容做出最佳猜测，这可能会导致意外结果。正如我们之前所说，它将图像嵌入到我们的页面中，该图像位于它出现的位置。空格（或任何字符）的简单属性值可以保持不加引号的状态，但建议您将所有属性值加引号，因为这可以使代码更加一致和易于理解。创建链接后，单击它以确保它将您发送到您想要的地方。
IPython的HTML魔法：%%html_header命令全解析
2401_85762266的博客
07-24 1146
IPython是一个增强的Python交互式解释器，而Jupyter Notebook是一个基于Web的开源项目，允许用户创建和共享包含实时代码、方程、可视化和解释性文本的文档。HTML头部是网页文档的元数据区域，它包含了文档的标题（title）、样式表链接（link）、脚本链接（script）等信息。的使用，可以让您更灵活地定制Notebook的样式和功能，从而提供更加丰富和个性化的文档体验。命令的使用非常简单。你只需要在Notebook的单元格中输入该命令，然后写入你想要添加到头部的HTML代码即可。
HTML(五）——HTML区块，布局
m0_62701594的博客
07-23 477
HTML可以通过 <div> 和 <span>将元素组合起来，可以来布局，就是盒子，div是块级盒子，里面 可以放任何东西，span里面装的是文本。
HTML开发小技巧：根据用户浏览器的分辨率调整控件的大小
最新发布
ioioppk的博客
07-25 537
在Html页面开发中，我们通常会用Style进行控件的宽度高度进行控件的格式设置，如果直接设置像素的话，无法根据用户的浏览器进行宽高的适配，所以我们要做到根据实际使用的浏览器进行控件大小的自动调整，以下是几种控件自动调整的方式：
HTML（六）——HTML表单和框架
m0_62701594的博客
07-23 774
HTML 表单用于收集用户的输入信息，是一个包含表单元素的区域HTML 表单表示文档中的一个区域，此区域包含交互控件，将用户收集到的信息发送到 Web 服务器。HTML 表单通常包含各种输入字段、复选框、单选按钮、下拉列表等元素。<form>元素用于创建表单，action属性定义了表单数据提交的目标 URL，method属性定义了提交数据的 HTTP 方法（这里使用的是 "post"）。<label>元素用于为表单元素添加标签，提高可访问性。<input>
HTML meta
Gary Leong
07-24 208
meta>标签用于提供html文档的元信息（metadata）。这些信息不会显示在页面上，但会被浏览器或搜索引擎用来识别页面的编码方式、关键字、描述、作者信息、刷新时间等。
HTML前端 盒模型及常见的布局 流式布局 弹性布局 网格布局
wuyujin1997的博客
07-23 309
CSS 两种盒模型 box-sizing content-box 和 border-box流式布局 flow layout弹性布局 flex layout HTML CSS网格布局 grid layout HTML CSS
html笔记
weixin_51644244的博客
07-22 2633
/</</</本地访问：file:///D:\Project\html\html01\html01/第一章.htmlhttp://https:// 加密协议网络传输协议 超文本传输协议常见的：** < a >、< strong >、< b >、< em >、< i >、< del >、< s >、< ins >、< u >、< span >、< img />、< input />、< select >、< textarea >、< br />**、等，其中 < span > 标签是最典型的行内元素。
HTML学习笔记：常见错误与修复
“html学习笔记，包括html，javascript，css的学习与工作经验总结，更新至2013-6-15。” 在HTML、JavaScript和CSS的学习过程中，了解并掌握常见的问题和解决方案是至关重要的。这份学习笔记主要涵盖了这些方面，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值