狂神Java学习笔记——HTML（一）

最新推荐文章于 2023-01-18 22:01:39 发布
最新推荐文章于 2023-01-18 22:01:39 发布
阅读量652 收藏 6
点赞数 1
分类专栏： 追随狂神学Java 文章标签： html html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38425976/article/details/106584466
版权

初识HTML

  • HyperTextMarkupLanguage（超文本标记语言）
  • < body >、< /body>等成对的标签，分别叫做开放标签和闭合标签，单独呈现的标签（空元素），如< hr/ >;意为用/来关闭空元素。
  • html注释：< !–注释内容–>
<!--DOCTYPE：告诉浏览器使用什么规范（默认是html）-->
<!DOCTYPE html>
<!--语言 zh中文 en英文-->
<html lang="zh">
<!--head标签代表网页头部-->
<head>
<!--    meta 描述性标签，表示用来描述网站的一些信息-->
<!--    一般用来做SEO-->
    <meta charset="UTF-8">
    <meta name="keywords" content="hyx的java学习">
    <meta name="description" content="一起来学习java">
    <!--网站标题-->
    <title>Title</title>
</head>
<!--body代表主体-->
<body>
Hello World！
</body>
</html>

网页基本标签

  • 标题标签
  • 段落标签
  • 换行标签
  • 水平线标签
  • 字体样式标签
  • 注释和特殊符号
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签</title>
</head>
<body>
<!--标题标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签-->
<p>p换行1</p>
<p>p换行2</p>
<!--水平线标签-->
<hr/>
<!--换行标签-->
换行1 <br/>
换行2 <br/>
<!--换行标签比较紧凑，段落标签有明显段间距-->
<!--粗体 斜体-->
<h1>字体样式标签</h1>
粗体：<strong>I love you </strong><br/>
斜体：<em>I love you </em><br/>
<!--特殊符号-->
空格：1&nbsp;2&nbsp;&nbsp;3&nbsp;&nbsp;&nbsp;4<br/>
空格：1 2  3   4<br/>
大于号&gt;<br/>
小于号&rt;<br/>
版权符号&copy;<br/>
<!--特殊符号记忆：&开头;结尾，只要在idea中&敲出后就有提示-->
</body>
</html>
  • 图像标签
  • 链接标签
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图像和链接标签</title>
</head>
<body>
<!--
src:资源地址
相对地址，绝对地址
../上级地址
alt：在图片加载失败的时候，就会用文字代替
title:鼠标悬停在图片上时，所显示的名字
width height 图片的高和宽
-->
<img src="../xxx.jpg" alt="oops!图像不见了" title="123">
<br/>
<!--
href：跳转页面的地址
a标签内文字：即显示的文字
可以把图片放在a标签内，点击图片跳转网页
target:表示在哪打开新网页_self:当前标签打开 _blank:新的页面中打开
-->
<a href="https://www.baidu.com" target="_blank" title="123">你xxxx不会百度吗</a>
<br/>
<a href="https://www.baidu.com"><img src="../xxx.jpg" alt="oops!图像不见了"></a>
<!--锚链接
1.需要一个标记锚
2.跳转到标记
页面内跳转
#
-->
<a name="top"></a>
<a href="#top">回到顶部</a>
<br/>
<!--也可以在网址后添加#号跳到对应网站的对应位置-->
<a href="https://www.baidu.com#down">百度底部</a> <br/>
<!--功能性链接
邮箱链接：mailto
qq链接
-->
<a href="mailto:xxxxxxqq.com">点击联系我</a>
<a target="_blank"
   href="http://wpa.qq.com/msgrd?v=xxx&uin=&site=qq&menu=yes">
    <img border="0"
         src="http://wpa.qq.com/pa?p=2::52" alt="点击这里加我领取小电影"
         title="点击这里加我领取小电影"
    />
</a>
</body>
</html>
  • 行内元素和块元素
  • 块元素
    • 无论内容多少，该元素独占一行
    • （p h1-h6）
  • 行内元素
    • 撑开宽度，左右都是行内元素的可以排在一行
    • （a strong em …）
程序猴hyx
关注
  • 1
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【狂神】JAVA学习全套笔记（完整版）
03-12
内容包含： 1、JAVA SE 2、MySQL + JDBC 3、JAVA WEB 4、Mybatis 5、SSM 6、大前端 7、Vue 8、SpringBoot 9、Spring Security 10、Shiro 11、Spring Cloud 12、JVM 13、JUC 14、Git 15、Linux 16、Redis 17、ElasticSearch 18、Docker
【狂神】HTML笔记
QinLaoDeMaChu的博客
04-25 1259
目录1. 初识HTMl2. 网页基本元素3. 网页基本标签4. 图像标签5. 链接标签6. 行内元素和块元素7. 列表8. 表格9. 媒体元素10. 页面结构分析11. iframe内联框架12. 初识表单post和get提交13. 文本框和单选框14. 按钮和多选框15. 文本域和文件域16. 搜索框滑块和简单验证17. 表单的应用18. 表单初级验证 1. 初识HTMl 什么是HTML？ Hyper Text Markup Language : 超文本标记语言 超文本包括：文字、图片、音频、视频、动画
JAVA前端部分（HTML+CSS+JavaScript）（狂神说笔记）
a_123456598的博客
11-10 1508
【HTML】 1.初识HTML： 2.元素=标签+属性+内容 （1）网页基本标签 （2）图像标签 （3）超链接标签 a、页面间链接 b、锚链接 c、功能性链接 QQ链接代码在“QQ推广”里生成。 【补充】块元素和行内元素 元素包括：标签、属性、内容。 （4）列表标签 （5）表格标签 （6）媒体元素 3.页面结构 放在<body></body>里面。 4.内联框架： targ
CSS——CSS常用的字体样式
热门推荐
万里顾一程的博客
11-08 1万+
CSS——字体样式 常用： font-family：字体 font-size：大小 font-weight：粗细 color：颜色 字体样式测试 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body{ font-family:楷
【狂神说Java】HTML5笔记完整教学通俗易懂
Martin-share的博客
01-18 341
【狂神说Java】HTML5笔记完整教学通俗易懂
狂神Java学习笔记————前端入门——html、css、JavaScript学习代码
06-17
此资源为我跟着B站up主【遇见狂神说】java系列视频中前端入门部分学习过程中所写 大部分和视频保持一致，有一些自己的理解和一些扩展的部分
狂神Docker学习笔记.pdf
03-10
学习docker时看到的学习笔记
狂神说Java学习笔记
05-19
Note1~16
JAVA学习笔记————————
04-25
——————————————————————————————————————————————
【狂神说Java】Java基础详细笔记(全)
Martin-share的博客
01-06 6475
狂神说Java之Java基础-程序运行机制-基础语法-流程控制-方法-数组-面向对象-异常
java全栈笔记
02-21
全栈练习笔记，用思维导图把各个技术点全部串联起来。
html笔记（狂神-完整版）
qq_49898212的博客
06-10 1457
html笔记（狂神-完整版） 生活总是让我们遍体鳞伤，但到后来，那些受伤的地方一定会变成我们最强壮的地方 背景颜色 bgcolor <body bgcolor="widte"> 靓仔 </body> 注释 <!-- 不添加注释 --> <body> 不添加注释： 靓仔 靓仔 </body> <br> <hr> <!-- 添加注释 --> <body>
狂神说html笔记
m0_63323097的博客
03-05 632
狂神说html5笔记 IDEA作为主要工具 vscode的html preview 插件功能： Toggle Preview - ctrl+shift+v or cmd+shift+v Open Preview to the Side - ctrl+k v or cmd+k v HTML标签 注释标签 注释开始< !-- 注释结束-- > 标题标签： <h1>一级标签</h1> <h2>二级标签</h2> <h3>三级标签&lt
【狂神说JAVA】注解和反射【基础巩固】
weixin_46703850的博客
03-27 950
java基础巩固
【狂神说JAVA】CSS详细笔记(全)
Martin-share的博客
01-18 984
【狂神说JAVA】CSS笔记（全）
狂神说Java--Java学习笔记(合集)
qq_41924554的博客
07-22 2459
笔记参考来源狂神说Java视频 https://www.bilibili.com/video/BV12J41137hu 本篇笔记有点长，可以根据目录定位，建议配合视频学习。 Java流程控制 用户交互Scanner 之前我们学的基本语法并没有实现程序和人的交互，Java给我们提供了一个工具类，可以获取用户的输入。 java.util.Scanner是Java5的新特征，我们通过Scanner类来获取用户的输入。 基本语法 Scanner s = new Scanner(System.in); .
Java网络编程简单笔记
weixin_51418572的博客
12-03 331
网络编程 概述 就是用来实现网络互连的不同计算机上运行的程序间可以进行数据交 计算机网络： 计算机网络是指将地理地理位置不同的具有独立功能的多台计算机及其外部设备，通过通信线路连接起来，在网络操作系统，网络管理软件及网络通信协议的管理和协调下，实现资源共享和信息传递的计算机系统。 网络编程的目的： 无线电台。。。传播交流信息，数据交换。通信 想要达到这个效果需要的是什么： 如何准确的定位网络上的一台主机 192.168.xxx.xxx：端口,定位到这个计算机上的某个资源 找到了这个主机，如何传输数据？
狂神Java学习笔记————HTML（二）
hyx的博客
06-08 800
列表 列表就是信息资源的一种展现形式，它可以使信息结构化条理化，并且以列表的样式显示出来，以便浏览者能更快捷地获取相应的信息 可以在列表中嵌套列表，内列表和外层列表缩进明显区分 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>列表</title> </head> <body> <!--有序列表--
【狂神说Java】HTML5完整教学笔记
qq_44005101的博客
05-18 1335
【狂神说Java】HTML5完整教学笔记01 HTML详解1.1 初识HTML1.2 网页基本标签1.3 图像、超链接标签及网络布局1.4 表单及表单应用1.5 表单初级验证 01 HTML详解 1.1 初识HTML Hyper Text Markup Language（超文本标记语言） 超文本包括：文字、图片、音频、视频、动画等。 Html5+Css3 —>现在使用的版本 Html5提供了一些新的元素和一些有趣的新特性，同时也建立了一些新的规则。这些元素、特性和规则的建立，提供了许多新的网页功能，
狂神说java系列笔记
最新发布
05-09
狂神说Java系列笔记是一系列由狂神（Java资深讲师）所著的Java学习笔记，包括Java基础、JavaWeb、Spring、SpringBoot、MyBatis等方面的内容。这个系列笔记主要面向Java初学者和希望系统学习Java技术的人群，通过简洁...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值