HTML学习02之基础；元素；属性

最新推荐文章于 2024-05-19 17:34:30 发布
最新推荐文章于 2024-05-19 17:34:30 发布
阅读量92 收藏
点赞数 1
分类专栏： HTML学习 文章标签： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zxs1002/article/details/122500917
版权

一、基本标签，扩展及应用

标签

  1. HTML 标题（Heading）是通过<h1> - <h6>等标签进行定义的。
  2. HTML 段落是通过 <p> 标签进行定义的。
  3. HTML 链接是通过 <a> 标签进行定义的。
  4. HTML 图像是通过 <img> 标签进行定义的。

元素

  1. 行内元素：内容撑开宽度，左右都是行内元素的可以排在一行
  2. 块元素：无论内容多少，该元素独占一行

二、代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签学习</title>
</head>
<body>
<!--标题标签-->
<h1>1级标签</h1>
<h2>2级标签</h2>
<h3>3级标签</h3>
<!--段落标签-->
<p>好好学习</p>
<p>天天向上</p>
好好学习
天天向上
<!--水平线标签-->
<hr>
<!--换行标签-->
好好学习<br>
天天向上<br>
<!--粗体，斜体-->
粗体：<strong>i love you</strong><br>
斜体：<em>i love you</em><br>
<!--特殊符号-->
空   格<br>
空&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格<br>
&gt;<br>
&lt;<br>
&copy;<br>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图像标签学习</title>
<!--快捷键：img+tab键-->
</head>
<body>
<!--img标签
src:图片地址 相对地址，绝对地址
../ 上一级目录
alt:图片名字
title：悬停文字
width：宽度
height：高度
等等
-->
<img src="../resources/image/java.png" alt="Java学习" title="悬停文字" width="1250" height="600">
<a href="4.连接标签.html#down">跳转到第四个网页的底部</a>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>连接标签学习</title>
<!--快捷键：a+tab-->
</head>
<body>
<!--a标签
href:必填,表示跳转到哪个页面
target:表示窗口在哪打开  _blank新标签打开  _self在自己网页打开
-->
<!--文本超链接-->
<a href="https://www.baidu.com" target="_blank">点击我跳转到百度</a>
<!--图像超连接-->
<a href="https://www.baidu.com"><img src="../resources/image/java.png" alt="Java学习" width="1250" height="600"></a>

<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<p>aaa</p>
<!--锚链接
1.需要一个锚标记
2.跳转到标记
3.#top
-->
<a href="#top">回到顶部</a><br>
<a name="down">底部</a><br>
<!--功能性链接
邮件链接：
-->
<a href="mailto:1553537899@qq.com" target="_blank" title="点击联系我">点击可以联系我的QQ</a><br>
</body>
</html>

三.测试

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

作者有话说

博客创作不易，希望看到这里的读者，动动你的小手点个赞，如果喜欢的小伙伴可以一键三连，作者大大在这里给大家谢谢了。

小黑神zxs
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
HTML表单控件之基础介绍
qq_53977993的博客
11-10 1508
本章列举了一些基本的表单控件和它们的使用方法，希望对你有所帮助！
制作HTML网页之你应该避免的HTML元素和属性
01-08
新建一个前端学习qun438905713，在群里大多数都是零基础学习者，大家相互帮助，相互解答，并且还准备很多学习资料，欢迎零基础的小伙伴来一起交流。 有人建议我们不要歌颂标准尽管我们教授基于标准的HTML和CSS，但...
网页制作基础学习——HTML+CSS常用代码
北辰的博客
02-01 3万+
HTML（HyperText Markup Language）,即超文本标记语言，是用于描述网页文档的一种描述标记语言。是标准通用标记语言下的一个应用，也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。
CSS选择器详解及部分元素属性
小小码农
03-12 2304
CSS选择器详解及部分元素属性
机器学习之基础知识（全）
m0_58086930的博客
08-06 2万+
学习机器学习前必备知识体系，比较全面，该系列课程笔记会一直更新。本文包括机器学习里涉及到的基本概念，环境的安装，Matplotlib,numpy,pandas的讲解。
HTML零基础入门教程（详细）
热门推荐
ZONGXP的博客
10-22 21万+
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。 HTML 指的是超文本标记语言:HyperTextMarkupL...
HTML基础--表单元素知识
qq_44489836的博客
02-22 4013
学习目标： 通过简单的实践，学习基本的 HTML FORM 标签，理解各种表单元素的使用场景，并且掌握表单一系列基本验证方式。 学习内容： 1.HTML表单 HTML 表单用于搜集不同类型的用户输入。 (1)<form>元素 HTML 表单用于收集用户输入。 <form>元素定义 HTML 表单： <form> ... form elements ... </form> 表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮等等。 (2
html5学习15：表格元素
八十岁老将的博客
02-07 2248
1、基本的表格 有三个元素是每个表格都必须要有的: table、tr和td。元素table，是HTML用以支持表格式内容的核心元素，它表示HTML文档中的表格。 1.1 table元素 属性：border 包含：caption,colgroup,thead,tbody,tfoot,tr,th,td 1.2 tr元素 父元素：table,thead,tfoot,tbody 内容：td,th 1.3 td元素 属性：colspan,rowspan,headers <table> <tr
零基础HTML教程(24)--表单输入元素
程序员大阳
03-18 3012
表单元素介绍
学习通 HTML5基础
m0_59742894的博客
01-06 2719
1【单选题】 位于HTML文档的最前面，用于向浏览器说明当前文档使用哪种 HTML 或 XHTML 标准规范的标记是（ ）。 A、 <!DOCTYPE> B、 <head></head> C、 <title></title> D、 <html></html> 我的答案：A 2【单选题】 在HTML中，网页要显示的主体内容应放置在（ ）。 A、 .
HTML基础学习
qq_46492364的博客
03-03 2547
文章目录前端学习一、【前端开发介绍】二、【互联网原理】三、【纯文本格式】四、【HTML概述】五、【HTML标签】六、【HTML元素】七、【HTML属性】总结 前端学习 今天是正式学习前端的第一天，以前也学过一点点，今天开始将在这里见证我的前端成长之路，我将把每日学到的东西进行梳理总结，分享在这里啦！ 一、【前端开发介绍】 前端开发：创建web页面或者是APP等前端界面呈现给用户的过程。 核心技术：HTML 、CSS 、JavaScript及衍生出的各种技术和框架等。 应用场景：PC、移动APP、小程.
HTML学习笔记包括简介、基础、元素、属性、标题、段落等
04-15
html
HTML基础学习基础认知，适合小白玩
05-12
表单元素 textarea标签 select及option标签 button标签 label标签的应用 fieldset及legend标签 表单属性与表单提交 框架集与框架 框架集的嵌套 浮动框架 超链接和表单的目标框架或窗口 使用base标签设定...
JSP学习笔记之基础语法
01-08
@page 属性1=”属性值” 属性2=”属性值1,属性值2″ 属性n=”属性值n”%> jsp注释 在jsp页面的注释。 HTML的注释： <!–html注释–>　//客户端可见 jsp的注释： <%–html注释–%>　//客户
AngularJS基础学习笔记之简单介绍
01-19
AngularJS通过指令对HTML属性进行了扩展，然后通过表达式将数据绑定到HTML元素中。 AngularJS是一个JavaScript框架 　AngularJS是一个JavaScript框架，它是由JavaScript语言编写的类库。 　AngularJS以JavaScript...
零基础HTML教程(34)--HTML综合实例
程序员大阳
05-18 651
DOCTYPE html > < html > < head > < meta charset = " utf-8 " > < title > 生平简介 </ title > </ head > < body > <!-- 头部 --> < header > < h1 > 苏轼网 </ h1 > </ header > <!
自动化测试报告样式HTMLTestRunner、BeautifulReport、HTMLReport、Allure你喜欢哪个？
qq_48811377的博客
05-17 701
有很多种自动化测试报告样式，接下来主要看下这些常用样式的效果是怎样的每个样式各有特点，选择自己喜欢的使用就好了自动化测试时你用的最多的是哪个呢？
01.认识HTML及常用标签
2301_80401457的博客
05-14 984
标题1描述内容1111标题2描述内容2222无序列表ul {li {北京上海广州
超链接的魅力：HTML中的 `＜a＞` 标签全方位探索！
最新发布
一个做过前端开发的产品经理，经历过睿智产品的折磨导致脱发之后，励志要翻身"农奴"把歌唱，一边打入敌人内部一边持续提升自己，为我们广大开发同胞谋福祉，坚决抵制睿智产品折磨我们码农兄弟！
05-19 988
超链接是互联网的脉络，它不仅仅是一个技术点，更是信息流动的桥梁。今天，我们不仅学习了基础，也探索了高级技巧和最佳实践。但旅程远未结束，超链接的世界还有更多等你去发现。现在轮到你了！在你的项目中实践这些技巧，或者在评论区分享你遇到的有趣超链接应用。让我们携手，让互联网的每一个角落都充满活力与连接！你曾用超链接实现过哪些有趣的交互？或者在超链接使用过程中遇到过哪些坑？分享你的故事，让我们共同成长！🌟欢迎来到我的博客，很高兴能够在这里和您见面！
强化DOM基础知识，学习如何在JavaScript 中操作HTML元素和 CSS样式心得
06-02
2. 操作元素属性：可以使用 `element.attribute` 或 `element.getAttribute()` 来获取元素属性，使用 `element.attribute = value` 或 `element.setAttribute(attribute, value)` 来设置元素属性。例如，可以使用 `...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值