HTML初体验之各种标签练习

首先是<!DOCTYPE>标签

放在网页顶部的doctype声明是让浏览器进入正确呈现模式的关键。浏览器自动切换到恰当的呈现模式，以便正确显示由doctype声明所指定的文档种类。doctype声明指出阅读程序应该用什么规则集来解释文档中的标记。

!DOCTYPE html 是html5标准网页声明,全称为Document Type HyperText Mark-up Language，支持HTML5的浏览器都能识别这个声明，表示这是一个HTML5网页。

注意：每种标签都是成对出现的，有头必有尾

（头部）head、（主体）body为HTML的基本框架结构，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。

title为标题标签

center对其所包括的文本进行水平居中

h1~h6标签可以修饰页面的主标题（文字大小），其中h1的文字最大，h6的文字最小

p /p作为文字段落标签

&nbsp； 和&emsp为空格转义符，其中&emsp占一个字符宽度，一般不受字体影响

img 为图片标签，可以链接图片路径

当图片路径找不到时，需要使用alt属性进行设置来提示文字

一般图片、视频只用设置width（宽度），不用设置高度，以防画幅形变

<!DOCTYPE html>

<html>

    <head>

        <title>HTML基本标签学习</title>

    </head>

    <body>

        <!--这是一行html注释-->

        <!-- 快捷键是ctrl+/键 -->

        hello world

        <!-- 首先用center标签把所有内容包裹起来 -->

    <center>

        <!-- 数字越小，字体越大 -->

        <h1>【思政教学部】从娱乐圈乱象看历史虚无主义——记第二十三期鱼城热点研讨会</h1>

        <!-- 水平线标签  size属性可设置粗线，width可设置高度,建议使用百分比-->

        <hr size ="1px" width="80%" />

        <!-- 段落标签p -->

        <p>发布日期: 2021-10-19 浏览次数：5</p>

        <p>

            <!-- 空格转义符：&nbsp; -->

            <!-- 空格转义符：&emsp; 占一个字符宽度，一般不受字体影响 -->

            &emsp;&emsp;为帮助同学们树牢唯物史观，提高运用科学的历史观方法论分析问题和解决问题的能力，警惕和反对历史虚<br/>

            无主义，10月13日下午4点思政教学部政治理论教研室在我校鱼城书院，结合近段时间来娱乐圈频频发生的明星<br/>

            <!-- 使用<br/>进行换行 -->

            历史认识乱象，通过具体事例与理论相结合的方式，开展了鱼城热点研讨会第二十三期“从娱乐圈乱象看历史虚无主义”。

        </p>

        <!-- 插入图片，使用img标签 放在和html同一个文件夹里面-->

        <img src = "lisa.jpg" width = "400px" alt ="lisa太火啦">

        <!-- 需要指定src属性，src的值是图片所在位置 -->

        <!-- 当图片路径找不到时，需要使用alt属性进行设置来提示文字 -->

        <p>

            &emsp;&emsp;活动伊始，唐维惟老师对近段时间来娱乐圈出现的历史虚无主义事件进行了举例介绍，通过这些例证使同学们直观了解到历史<br/>

            虚无主义在日常和网络的泛滥，让同学们更加具体地认识到历史虚无主义给国家和青少年带来的深深伤害。

            唐老师针对明星历史认识乱象向同学们揭示了其背后的原因，她指出之所以会出现这样的情况主要在于部分明星自身对党和国家缺乏政治认同、

            <br/>对党带领全民族筚路蓝缕、披荆斩棘、取得辉煌成就的历史缺乏正确认识，从而在价值观上产生了偏差。唐老师勉励同学们<br/>

            作为当代青年不仅要认识到歪曲历史的险恶，更要勇于同这些歪曲历史的行为做斗争。

        <img src = "http://www.cqyti.com/__local/6/96/21/3015CDA62967793055E4247A70E_2D60D850_29707.jpg" width = "400px">

        </p>

    </center>

    </body>

</html>

HTML初体验之各种标签练习的更多相关文章

  1. 【腾讯Bugly干货分享】基于 Webpack & Vue & Vue-Router 的 SPA 初体验

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57d13a57132ff21c38110186 导语 最近这几年的前端圈子,由于 ...

  2. 【Knockout.js 学习体验之旅】（1）ko初体验

    前言 什么,你现在还在看knockout.js?这货都已经落后主流一千年了!赶紧去学Angular.React啊,再不赶紧的话,他们也要变out了哦.身旁的90后小伙伴,嘴里还塞着山东的狗不理大蒜包, ...

  3. MarkDown初体验

    初体验 写在前面 一周前第一次听说了MarkDown这个编辑器,通过它知道了LaTex,正好满足了我多年对网上博客里的公式简陋的表达的需求.起初,只是用到了LaTex公式这一个功能 , 对于主要文字的 ...

  4. Knockout.js初体验

    前不久在网上看到一个轻量级MVVM js类库叫Knockout.js,觉得很好奇,搜了一下Knockout.js相关资料,也初体验了一下,顿时感觉这个类库的设计很有意思.接下来就搞清楚什么是Knock ...

  5. python窗体——pyqt初体验

    连续两周留作业要写ftp的作业,从第一周就想实现一个窗体版本的,但是时间实在太短,qt零基础选手表示压力很大,幸好又延长了一周时间,所以也就有了今天这篇文章...只是为了介绍一些速成的方法,还有初学者 ...

  6. 基于 Webpack & Vue & Vue-Router 的 SPA 初体验

    基于 Webpack & Vue & Vue-Router 的 SPA 初体验 本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com ...

  7. Oracle SQL篇（一）null值之初体验

           从我第一次正式的写sql语句到现在,已经超过10年的时间了.我写报表,做统计分析和财务对账,我一点点的接触oracle数据库,并尝试深入了解.这条路,一走就是10年,从充满热情,到开始厌 ...

  8. iOS7 初体验

    iOS7 初体验 近日来由于iOS7的发布,引来业界的各种吐槽. 为了体验一把,我已经把iPhone5刷成了iOS7,也下载Xcode5-DP并进行了测试.我想说的是iOS7与Xcode5-DP中新增 ...

  9. FileTable初体验

    FileTable初体验 阅读导航 启用FILESTREAM设置 更改FILESTRAM设置 启用数据库非事务性访问级别 FileTable 在我接触FileTable之前,存储文件都是存储文件的链接 ...

  10. Scrapy 初体验

    开发笔记 Scrapy 初体验 scrapy startproject project_name 创建工程 scrapy genspider -t basic spider_name website. ...

随机推荐

  1. （已解决）富文本编辑器：使用layui的layedit怎么回显存放在数据库里的富文本数据（包含有图片base64码）？

    1. 背景 我把富文本内容从后台导入到前端,回显在layui的layedit里面. 2. 步骤 直接在<textarea></textarea>中间进行赋值(我用的是模板赋值) ...

  2. 7.26-javascript

    折半查找:数据必须有序 //数组定义 let arr1 = [1,2,3,4,5]; //用字面量定义数组 let arr2 = new Array(1,2,3,4,5); //用字面量定义数组 le ...

  3. springboot整合mybatis以及mybatis源码分析

    1.@ComponentScan basePackages与value: 用于指定包的路径,进行扫描 basePackageClasses: 用于指定某个类的包的路径进行扫描 nameGenerato ...

  4. C盘爆红满了怎么办？既然C盘装不下了，那咱给C盘扩容不就完事了吗！

    我们在使用电脑的过程中,经常容易出现C盘爆红,反而其他盘还有大量可用空间的情况. 为什么会这样呢?其实主要就两种原因: 一是电脑使用习惯不好,不管什么软件都默认安装在C盘,大文件又喜欢放在桌面,久而久 ...

  5. nginx(一) の 入门解析

    OSI 模型的前三层 应用层: 每一个应用程序自定义的协议 表示层: 数据的压缩与解压缩.图片的编码与解码 会话层: 会话管理(session) 和 网络验证 .包括断点续传和服务器验证用户登录等.比 ...

  6. 调度平台&定时任务

    一.介绍: 1.调度平台能够定时 自动调用我们的脚本或程序,如每周.每天.每隔几小时等: 2.jenkins也可以算一种调度平台 但不是特别好,为了统一化管理.调度还是用专门的任务调度平台比较好 为什 ...

  7. Salesforce 发送Email时遇到的问题（Case当中的Filed不出现Email选项:ケースのフィールドにメールタブが表示されない）。

    普段はケースの発生源はメールと選択する場合.ディフォルトで「フィールド」の中に「メール」というタブが出てきますが. (平时当我们选择[Case]的[来源]为[Email]时,默认就会在field中出现 ...

  8. centos更改java的环境变量

    vi  /etc/profile 在最后添加这个信息,或修改这些信息 export JAVA_HOME=/usr/local/java/jdk1.8.0_251export CLASSPATH=.:$ ...

  9. 为什么用postman

    1,  保存测试的记录, 就是确保访问的地址,数据什么的,得到的结果是有效的2,  假设开始一个访问, 然后方便在本地debug, 因为有些访问是不能通过本地的浏览器来访问的, 比如前后端分离的情况, ...

  10. 解决: 无法打开明确指定的数据库“SSISDB”, 用户 'NT Service\SSISScaleOutMaster150' 登录失败.

    环境: WindowsServer2019Datacenter  SQL Server2019  SSMSv18 事情: SQL安装完成后, 发现系统日志中有如下报错:   解决: 无法打开明确指定的 ...