关于『HTML』:第一弹
关于『HTML』:第一弹
建议缩放90%食用
根据C2024XSC212童鞋的提问, 我准备写一稿关于『HTML』基础的帖
But!
当我看到了C2024XSC130的 "关于『HTML5』『CSS3』"后
猛然发现
我的代码居然
不! 符! 合! 标! 准! 了! 呜呜呜 (暴风哭泣)
我的风格突然就又双叒叕过时了
要是不能用,我岂不是误人子弟,残害祖国花朵
... ...
But!
经过我的亲自验证(拿OJ做实验)
发现
旧版HTML的代码格式还是可以用哒~[但你还是过时了(痛苦面具)], 接下来不废话直接开讲~
知道前面是废话就好
你现在看到的是这样的

其实我看到的,是这样的

糟糕,是幻术么
不!它是过时的HTML!
正文开始
一. 什么是HTML
(这段可以直接略过,反正你也看不懂)
- HTML 是用来描述网页的一种语言。
- HTML 指的是超文本标记语言: HyperText Markup Language
- HTML 不是一种编程语言,而是一种标记语言
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
- HTML 文档包含了HTML 标签及文本内容
- HTML文档也叫做 web 页面
二. HTML 标签
(这段也可以直接略过,没啥用)
- HTML 标记标签通常被称为 HTML 标签 (HTML tag)
- HTML 标签通常是成对出现的,比如 <p> 和 </p>
- 标签对中的第一个标签是开始标签,第二个标签是结束标签
- 开始和结束标签也被称为开放标签和闭合标签
一般格式:
<标签>内容</标签>
三. HTML 属性
(干货开始了)
(一). 标题
- HTML 标题(Heading)是通过 <h1 - h6> 标签来定义的
- 由于 h 元素拥有确切的语义,因此要慎重地选择恰当的标签层级来构建文档的结构。因此,请不要利用标题标签来改变同一行中的字体大小 (不要贪图字少)
代码:
<h1>这是一个一级标题</h1>
<h2>这是一个二级标题</h2>
<h3>这是一个三级标题</h3>
<h4>这是一个四级标题</h4>
<h5>这是一个五级标题</h5>
<h6>这是一个六级标题</h6>
效果:
这是一个一级标题
这是一个二级标题
这是一个三级标题
这是一个四级标题
这是一个五级标题
这是一个六级标题
(二). font 标签
- <font>规定文本的字体,字体的颜色,字体的大小
- face 属性定义字体的外观
- size 属性定义字体的大小
- color 属性定义字体的颜色
一般格式:
<font 属性=“需要的样式/颜色/字体大小”>内容</font>
1. face
代码:
<p><font face="宋体">这是一个文本</font></p>
<p><font face="微软雅黑">这是一个文本</font></p>
<p><font face="仿宋">这是一个文本</font></p>
<p><font face="楷体">这是一个文本</font></p>
效果:
这是一个文本
这是一个文本
这是一个文本
这是一个文本
2. size
代码:
<p><font size="1px">这是一个文本</font></p>
<p><font size="2px">这是一个文本</font></p>
<p><font size="3px">这是一个文本</font></p>
<p><font size="4px">这是一个文本</font></p>
<p><font size="5px">这是一个文本</font></p>
<p><font size="6px">这是一个文本</font></p>
<p><font size="7px">这是一个文本</font></p>
效果:
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
3. color
(1). 英文单词
代码:
<p><font color="red">这是一个文本</font></p>
<p><font color="orange">这是一个文本</font></p>
<p><font color="yellow">这是一个文本</font></p>
<p><font color="green">这是一个文本</font></p>
<p><font color="cyan">这是一个文本</font></p>
<p><font color="blue">这是一个文本</font></p>
<p><font color="purple">这是一个文本</font></p>
效果:
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
哇!七色彩虹!
(2). 色值
代码:
<p><font color="#66789A">这是一个文本</font></p>
<p><font color="#E5B193">这是一个文本</font></p>
<p><font color="#EFC884">这是一个文本</font></p>
<p><font color="#76A9DE">这是一个文本</font></p>
<p><font color="#9BCDFC">这是一个文本</font></p>
<p><font color="#E9A0B4">这是一个文本</font></p>
<p><font color="#6A90EA">这是一个文本</font></p>
效果:
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
这是一个文本
莫兰迪色系呢(夹带私货)
(三). HTML 段落
- HTML 段落是通过标签 p来定义的.
代码:
<p>这是一个段落</p>
<p>这是另一个段落</p>
效果:
这是一个段落
这是另一个段落
(四). 文本修饰
1. 删除线(中划线):
代码:
<p><del>我爱刷题ヾ(≧▽≦*)刷题爱我</del></p>
<p><s>这条挂掉</s></p>
效果:
我爱刷题ヾ(≧▽≦*)刷题爱我
这条挂掉
2. 下划线:
代码:
<p><u>今年817稻米节快乐鸭~</u></p>
效果:
今年817稻米节快乐鸭~
3. 加粗:
代码:
<p><b>小朋友你是否有很多问号</b></p>
<p><strong>山河拱手,为君一笑</strong></p>
效果:
小朋友你是否有很多问号
山河拱手,为君一笑
4. 缩小:
代码:
<small>我是您亲友为您预定的七夕蛤蟆</small>
效果:
我是您亲友为您预定的七夕蛤蟆
5. 斜体:
代码:
<i>一想二干三成功,一等二看三落空</i>
效果:
一想二干三成功,一等二看三落空
第一弹到这就结束了呢亲
第一弹完结撒花~ []~( ̄▽ ̄)~*
至于第二弹么... 我要学习三叔拖更(丙丙叔!我也来鸽稿辣~)
上述语言挺好使的 但它还是过时了呜呜呜
关于『HTML』:第一弹 就酱紫结束啦~叭叭~
下一篇:"关于『HTML』:第二弹"
关于『HTML』:第一弹的更多相关文章
- 关于『HTML5』第一弹
关于『HTML5』:第一弹 建议缩放90%食用 祝各位国庆节快乐!!1 经过了「过时的 HTML」.「正当时的 Markdown」的双重洗礼后,我下定决心,好好学习HTML5 这回不过时了吧(其实和 ...
- 关于『Markdown』:第一弹
关于『Markdown』:第一弹 建议缩放90%食用 声明: 在我之前已有数位大佬发布 "Markdown" 的语法知识点, 在此, 仅整理归类以及补缺, 方便阅读. 感谢 C20 ...
- 『MXNet』第一弹_基础架构及API
MXNet是基础,Gluon是封装,两者犹如TensorFlow和Keras,不过得益于动态图机制,两者交互比TensorFlow和Keras要方便得多,其基础操作和pytorch极为相似,但是方便不 ...
- 『PyTorch』第一弹_静动态图构建if逻辑对比
对比TensorFlow和Pytorch的动静态图构建上的差异 静态图框架设计好了不能够修改,且定义静态图时需要使用新的特殊语法,这也意味着图设定时无法使用if.while.for-loop等结构,而 ...
- 关于『HTML5』:第二弹
关于『HTML5』:第二弹 建议缩放90%食用 咕咕咕咕咕咕咕!!1 (蒟蒻大鸽子终于更新啦) 自开学以来,经过了「一脸蒙圈的 半期考试」.「二脸蒙圈的 体测」的双重洗礼,我终于有空肝 HTML5 辣 ...
- 关于『Markdown』:第二弹
关于『Markdown』:第二弹 建议缩放90%食用 道家有云:一生二,二生三,三生万物 为什么我的帖子不是这样 各位打工人们! 自从我学了Markdown以来 发现 Markdown 语法真的要比 ...
- 关于『HTML』:第二弹
关于『HTML』:第二弹 建议缩放90%食用 第二弹! 它来了! 它来了! 我竟然没有拖更,对了,你们昨天用草稿纸了么 开始正文之前提一个问题:大家知道"%%%"是什么意思吗?就这 ...
- 关于『进击的Markdown』:第一弹
关于『进击的Markdown』:第一弹 建议缩放90%食用 比起隐蔽物下的狙击手,Markdown更像冲锋陷阵的阵头兵 简单.粗暴.直接.而且好上手 各位晚上好! 早饭吃了吗您 我 今 天 没 吃 M ...
- 『PyTorch』第二弹重置_Tensor对象
『PyTorch』第二弹_张量 Tensor基础操作 简单的初始化 import torch as t Tensor基础操作 # 构建张量空间,不初始化 x = t.Tensor(5,3) x -2. ...
随机推荐
- es6零碎记忆
1:substring 和 substr var str = '0123456789' console.log(str.substring(1)); //123456789 console.log(s ...
- Linux 0.11源码阅读笔记-总览
Linux 0.11源码阅读笔记-总览 阅读源码的目的 加深对Linux操作系统的了解,了解Linux操作系统基本架构,熟悉进程管理.内存管理等主要模块知识. 通过阅读教复杂的代码,锻炼自己复杂项目代 ...
- java栈stack和堆heap的工作原理,用途及区别?举例说明
java堆和栈的区别[新手可忽略不影响继续学习] Java中内存分成两种:一种是栈stack,一种是堆heap.函数中的一些基本类型的变量(int, float)和对象的引用变量(reference) ...
- 小程序picker的使用
效果图: 代码: <view class='infoItem'> <view class='infoItem-left'><text style='color:red'& ...
- 用 rollup + gulp 造个轮子,别说还挺香
前戏 我是16年入了前端的坑,17年知道了gulp和rollup这两个玩意儿.由于那时webpack势头很猛,便一直没有正眼瞧过它一眼. 直到20年进了一家小公司,做了很多类似的小项目,相同的代码拷来 ...
- 《头号玩家》AI电影调研报告(一)
观<头号玩家>AI电影调研报告 一. 前言 有一部电影,上映开始就能让世界各不同年龄段.身处不同文化的人在一瞬间达到心意相通:其中的一些镜头,让影迷.游戏迷.ACG爱好者等拥有截然不同兴趣 ...
- WIN进程注入&BypassUAC&令牌窃取
WIN进程注入&BypassUAC&令牌窃取 本地提权-win令牌窃取 假冒令牌可以假冒一个网络中的另一个用户进行各类操作. 所以当一个攻击者需要域管理员的操作权限时候,需通过假冒域管 ...
- LC-24
[24. 两两交换链表中的节点](https://leetcode-cn.com/problems/swap-nodes-in-pairs/) 给你一个链表,两两交换其中相邻的节点,并返回交换后链表的 ...
- 【洛谷】P4555 [国家集训队]最长双回文串
P4555 [国家集训队]最长双回文串 题源:https://www.luogu.com.cn/problem/P4555 原理:Manacher 还真比KMP好理解 解决最长回文串问题 转化为长度为 ...
- 《手把手教你》系列基础篇(九十二)-java+ selenium自动化测试-框架设计基础-POM设计模式简介(详解教程)
1.简介 页面对象模型(Page Object Model)在Selenium Webdriver自动化测试中使用非常流行和受欢迎,作为自动化测试工程师应该至少听说过POM这个概念.本篇介绍POM的简 ...