Day_33_HTML初识

最新推荐文章于 2024-08-12 21:44:16 发布
最新推荐文章于 2024-08-12 21:44:16 发布
阅读量60 收藏
点赞数
分类专栏： 学习日志 文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_51589970/article/details/121256285
版权

1. 标题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题标签</title>
</head>
<body>
    <!-- 平级用 +  h1+h2+h3+h4+h5+h6 -->
    <!-- 嵌套关系 用 >  h1>h2>h3 -->
    <!-- 数量用 *  h1*5 -->
    <!-- 整体 用()  h1>(h2>h3*2)*3 -->
    <h1>壹号标题</h1>
    <h2>二号标题</h2>
    <h3>三号标题</h3>
    <h4>四号标题</h4>
    <h5>五号标题</h5>
    <h6>六号标题</h6>
</body>
</html>

2. 段落

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body bgcolor="pink" text="green">

    <h1>刘德华</h1>
    <!-- 属性 = 值 -->
    <hr width="80%" color="red" />
    <h2>基本信息</h2>
    <!-- p 段落标签 -->
    <p>刘德华（Andy Lau），1961年9月27日出生于中国香港，籍贯广东新会，中国香港影视男演员、歌手、制片人、作词人。</p>
    <p>1981年出演电影处女作《彩云曲》。1983年主演的武侠剧《神雕侠侣》在香港取得62点的收视纪录 [1-2] 。1985年发行首张个人专辑《只知道此刻爱你》 [11] 。1990年凭借专辑《可不可以》在歌坛获得关注 [12]
        。1991年创办天幕电影公司 [3] 。1994年获得十大劲歌金曲最受欢迎男歌星奖；同年担任剧情片《天与地》的制片人 [4] 。1995年在央视春晚上演唱其代表作《忘情水》 [13]
        。2000年凭借警匪片《暗战》获得金像奖最佳男主角奖 [5] ；同年被《吉尼斯世界纪录大全》评为获奖最多的香港男歌手 [14] 。</p>
    <p>2004年凭借剧情片《大块头有大智慧》获得金像奖最佳男主角奖 [271] ；同年凭借警匪片《无间道3：终极无间》获得金马奖最佳男主角奖 [6]
        ；同年第六次获得十大劲歌金曲最受欢迎男歌星奖。2005年获得香港UA院线颁发的全港最高累积票房香港男演员奖 [7] 。2006年获得釜山国际电影节亚洲最有贡献电影人奖 [8]
        。2012年凭借剧情片《桃姐》获得金马奖、金像奖最佳男主角奖 [9] ；同年担任第49届台湾电影金马奖评审团主席 [10] 。2015年第5次登上央视春晚并演唱歌曲《回家的路》 [15]
        。2020年发行个人首张数字专辑《演·唱》 [261] 。</p>
    <p>演艺事业外，刘德华关心公益慈善。1994年创立刘德华慈善基金会。2000年被评为世界十大杰出青年 [16] 。2005年发起亚洲新星导计划 [17] 。2008年被委任为香港非官守太平绅士 [18]
        。2010年获得第12届世界杰出华人奖 [19] 。2016年连任中国残疾人福利基金会副理事长 [16] 。</p>
    <!-- br 换行符 -->
    1<br />
    2<br />
    3
</body>

</html>

3. div&span

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    你好<br>
    <h1>你好</h1>
    <!-- div 独占一行,适合布局 -->
    <div>你好</div>
    <div>你好</div>
    <div>你好</div>
    <!-- span 在一行内显示,适合做一行内的文字操作 -->
    <span>你好</span>
    <span>你好</span>
    <span>你好</span>
    <span>你好</span>
    1<span >2</span>3
</body>
</html>

4. 语义标签

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    常规字体<br>
    <b>粗体字</b> <strong>粗体字</strong><br>
    <i>斜体字</i> <em>斜体字</em><br>
    <u>下划线</u> <ins>下划线</ins><br>
    <s>删除线</s><del>删除线</del>
</body>
</html>

5. img

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!--src 图像源,图片的地址-->
    <!--网络路径-->
    <!-- width : 设置图片的宽度
        height : 设置图片的高度
        如果宽高只设置一个,另一个等比例缩放
    -->
    <img  width="300" height="300" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.jj20.com%2Fup%2Fallimg%2F1114%2F060421091316%2F210604091316-6-1200.jpg&refer=http%3A%2F%2Fimg.jj20.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1639122120&t=2af3f353b02c253946eee4a8e15ddbd7">
    <!-- 相对路径 -->
    <!-- title : 鼠标悬停在图片上提示的文字 
        border ： 图片的边框
    -->
    <img title="美女" border=10 width="300"  src="./images/1.jpg" alt="">
    <!-- alt 找不到图片的时候 显示的文字 -->
    <img src="D:/1.jpg" alt="走丢啦">
</body>
</html>

6. 超链接

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- href : 目的地 -->
    <a href="http://www.baidu.com">百度一下,你就知道</a>
    <!-- target : 规定打开的方式,默认是当前窗口打开
            _self : 当前窗口打开
            _blank : 新窗口打开
    -->
    <a href="2" title="买买买!" target="_blank">淘宝</a>

    <!-- 点击图片,跳转淘宝 -->
    <a href="http://www.taobao.com" >
        <img src="./images/1.jpg" width="100" alt="">
    </a>

    <!-- 注意事项 必须有href属性,否则不能点击,检查是否拼错 -->
    <a herf="http://www.taobao.com">百度</a>
</body>
</html>

7. base

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 设置页面中所有的连接都在新窗口打开 -->
    <base target="_blank">
</head>
<body>
    <a href="1">111</a>
    <a href="2">222</a>
    <a href="3">333</a>
    <a href="4">444</a>
    <a href="5">555</a>
</body>
</html>

8. 锚点

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h1 id="top">目录</h1>
    <a href="#a1">个人生活</a>
    <a href="#a2">演艺经历</a>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <h3 id="a1">个人经历</h3>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <h3 id="a2">演艺经历</h3>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <p>1</p>
    <a href="#top">回到顶端</a>
</body>

</html>

势不可挡の内鬼
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
day1_初识html
小虾米and小菜鸡的博客
09-01 233
网页结构html是不是一种编程语言，而是一种超文本标记语言。<html> <head><title></title></head> <body></body> </html>以上格式就是所有网页中都会存在的，大家可以查看任何一个页面的源代码，再复杂的格式都有这些，网页详细的内容会包含在<body></body>中。其中<html> 与 </html> 之间的文本描述网页，<head>
Day_47 初识JavaWeb
qq_26942049的博客
11-29 176
Web流程 1.1 软件架构 1. C/S：客户端/服务器端 cs架构建立在专用的网络上，一般面向相对固定的用户群，它可以对权限进行多层次校验，提供了更安全的存取模式，对信息安全的控制能力很强； B/S：浏览器/服务器端 bs架构建立在广域网之上，面向是不可知的用户群，对安全的控制能力相对弱。 1.2 资源分类 1. 静态资源：所有用户访问后，得到的结果都是一样的，称为静态资源.静态资源可以直接被浏览器解析，如： html,css,JavaScript 2. 动态资源:每个用户访问相...
Day_01 HTML
qq_26942049的博客
11-10 179
由于代码看起来比较方便，就都用代码的形式来总结 1、初识HTML <!DOCTYPE html> <html> <!-- DTD 头,是告诉浏览器,当前用的版本 head : 告诉浏览器一些相关信息 比如标题,编码,关键字 body : 主体,给人看的 --> <head> <!--设置字符编码--> <met
day_29 HTML基础
G_z_s的博客
11-10 173
1.开发工具 我们主要的开发工具有编辑器,浏览器,photoshop (1)编辑器 常用的前端编辑器有:dreamweaver,sublime,webstorm,Hbulider,vscode 普通青年 Dreamweaver 文艺青年 sublime 高手和大傻子 用记事本 其实，屌丝青年也可以用sublime。。。 (2)浏览器 浏览器是网页显示、运行的平台，常用的浏览器...
day01_初识python
weixin_30445169的博客
05-23 156
编译型：一次性将所有的代码编译呈二进制文件。C/C++ 　　　　优点：执行效率高 　　　　缺点：开发速度慢，不能跨平台 解释型：当程序运行时，从上到下一行一行的解释为二进制文件 　　　　优点：开发效率快，可以跨平台 　　　　缺点：执行效率低 python2与python3区别： 　　python2源码，重复率高，不规范，而python要求：简单/明确/优雅 　　python2默认A...
Day01_HTML
grp_grp_grp的博客
02-21 134
1. html 初识 HTML（英文Hyper Text Markup Language的缩写）中文译为“超文本标签语言”，是用来描述网页的一种语言。所谓超文本，因为它可以加入图片、声音、动画、多媒体等内容，不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接。 HTML不是一种编程语言，而是一种标记语言 (markup language) 总结： HTML 作用就是用标记标签来描述网页，把网页内容在浏览器中展示出来。 2. 骨架 <!DOCTYPE html> &
Day01_初识Python
weixin_30344795的博客
07-30 165
Python简介 Python的历史 1.1989年圣诞节：Guidao von Rossum开始写Python语言的编译器 2.1991年2月：第一个Python编译器（同时也是解释器）诞生，他是使用C语言实现的（后续又出现了Java和C#　实现的版本Jython和IronPython，以及PyPy、Brython、Pyston等其他实现）。可以调用C语言地库函数。在最早的版本里...
day_03、初识函数
weixin_34237596的博客
05-24 58
一，什么是函数？ 函数是组织好的，可重复使用的，用来实现单一，或相关联功能的代码段。 函数能提高应用的模块性，和代码的重复利用率。你已经知道Python提供了许多内建函数，比如print()，len()等。但你也可以自己创建函数，这被叫做用户自定义函数。 二， 函数的定义与调用。 定义：def 关键词开头，空格之后接函数名称和圆括号()，最后还有一个":"。 　　　def 是固定...
Day_41_DOM
DuckBuBi
11-19 76
1. webAPI 1.1 API的概念 API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。例如：alert()、prompt()、log()、reverse()、getMonths() 任何开发语言都有自己的API API的特征输入和输出(I/O) API...
创建一个简单的贪吃蛇游戏：HTML、CSS和JavaScript教程
Mr_Zhangyuge的博客
08-08 1598
在本教程中，我们将逐步构建一个简单的贪吃蛇游戏。这个项目适合初学者，可以帮助你理解HTML、CSS和JavaScript的基础知识，并掌握如何将它们结合起来创建一个完整的游戏。
html--前端
m0_60274660的博客
08-07 370
只有body中的标签的内容才会输出到中断；如果要看script标签中的javascript代码的输出，需要按F12,点击Console查看。
html复习
m0_73280507的博客
08-12 657
Jsonp是前端程序员为了解决跨域问题，提出的一种解决拌饭，只支持get请求，不支持post请求，jnonsp是实现定义一个用于获取跨域响应数据的回调函数，通过没有同源策略限制的script标签发起的一个请求，将回调函数的名称放到这个请求的query参数中，然后服务端返回这个回调函数的执行，并将需要响应的数据放到回调函数的参数里，前端的script标签请求到这个执行的回到函数中立马执行，于是就拿到了执行的响应数据。控制首页链接数量， 网站首页不能有太多的链接，也不能有太少的链接。外链选择，友站友情链接。
HTML - 简易版打字练习
Lushengshi的博客
08-09 736
纯html实现打字软件练习效果
HtmlUnit：探索Web自动化的强大工具
Aaron_945的博客
08-12 589
HtmlUnit 是一个开源的“无头”（headless）浏览器，它模拟了浏览器环境，允许开发者在不需要实际浏览器界面的情况下执行JavaScript、CSS、DOM操作以及HTTP请求。它模拟了浏览器的许多方面，包括DOM操作、CSS选择器、AJAX请求等，使得开发者可以在服务器端或无需图形界面的环境中执行Web应用程序的自动化测试。通过模拟浏览器的行为，HtmlUnit使得开发者能够在无需实际浏览器界面的情况下执行复杂的Web操作。对于AJAX请求，HtmlUnit提供了。
html实现funnel图
最新发布
Debug yourself!
08-12 618
这些方法中，使用JavaScript库（如ECharts）是最强大且灵活的，可以处理复杂的数据和交互。如果只是简单的静态漏斗图，CSS方法也可以满足需求。这是最简单和推荐的方式，因为这些库提供了内置的漏斗图功能，并且可以高度自定义。如果你不想依赖外部库，可以使用纯HTML和CSS来实现一个简单的漏斗图。你还可以使用SVG（矢量图形）直接绘制漏斗图。// 使用刚指定的配置项和数据显示图表。// 初始化echarts实例。// 指定图表的配置项和数据。
Html详解——Vue基础
敲厉害的燕宝的博客
08-07 1142
是一种用来。网页内容可以是：一组段落、一个重点信息列表、也可以含有图片和数据表。正如标题所示，本文将对 HTML 及其功能做一个基本介绍。HTML 不是一门编程语言，而是一种用于定义内容结构的标记语言。
【HTML】纯前台字符验证码
BigBigHang的博客
08-12 182
【HTML】纯前台字符验证码
HTML&CSS
m0_73620971的博客
08-05 1403
1、 是一个单标签。2、img 标签必须具有 src 属性，a 标签必须具有 href 属性。3、input 标签中必须指明 type 属性，其中提交按钮必须放至 form 标签内。4、类选择器前缀为 "."，ID选择器前缀为 "#"。
DAY_OF_WEEK,
03-28
DAY_OF_WEEK是一个常见的日期操作，用于获取给定日期的星期几。在不同的编程语言和日期库中，DAY_OF_WEEK的实现方式可能会有所不同，但基本原理是一致的。 在大多数编程语言中，日期通常以特定的格式表示，例如年、月、日。DAY_OF_WEEK函数可以接受一个日期作为输入，并返回该日期对应的星期几。通常，星期几用数字表示，例如1表示星期一，2表示星期二，以此类推。 以下是一个示例，展示了如何使用DAY_OF_WEEK函数获取给定日期的星期几： ```python import datetime def get_day_of_week(date): # 将日期字符串转换为datetime对象 date_obj = datetime.datetime.strptime(date, "%Y-%m-%d") # 使用weekday()方法获取星期几（0表示星期一，1表示星期二，以此类推） day_of_week = date_obj.weekday() return day_of_week # 示例调用 date = "2022-01-01" day_of_week = get_day_of_week(date) print(day_of_week) # 输出：5（表示星期六） ``` 请注意，具体的实现方式可能因编程语言和日期库而异。上述示例是使用Python中的datetime库来实现的。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值