HTML基础

最新推荐文章于 2022-09-09 18:59:08 发布
最新推荐文章于 2022-09-09 18:59:08 发布
阅读量350 收藏 2
点赞数
分类专栏： 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49331059/article/details/109227158
版权
这篇博客介绍了HTML的基础知识，包括文档结构、元标记、标题、文字分隔、排版、字体、超链接、表格、输入标签、下拉列表、文本域、表单、框架、多媒体以及层的使用。内容详细，适合初学者入门。
摘要由CSDN通过智能技术生成

HTML

  • html的意思是"超级文本标记语言"，用它编写出来的文档的文件拓展名是".html"或".htm"，这是可供浏览器解释浏览的文件格式
  • html标记两端有两个符号"<“和”>"，这两个符号称为角括号。html标签通常成对出现，例如"“和”"，前一个是开始标记，后面的是结束标记，在开始标记和结束标记之间的文本是元素内容，html标记与大小写无关，标记可以有自己的属性，属性能为页面上的html元素提供附加信息

HTML的文档结构

html的文档结构主要是有3部分组成的：

  • 标记于html文件的最前面，用来表示html文件的开始，的标记是放在html的最后面，用来表示html文件的结束，两个标记必须一起使用
  • 和构成html文件的头部部分，在此标记对之间可以使用和等标记对，这些标记都是描述html文档相关信息的标记对，标记对之间的内容不会在浏览器中的内容部分出现，两个标记必须同时使用
  • 和是html文档的主体部分，在此标记可以包括

    、

    等众多的标记，他们所定义的文本、图片等会在浏览器的内容部分显示出来，两个标记必须一起使用。

  • html的文档结构实例

    <html>
	<head>
		<title>html的结构</title>
	</head>
	<body>
		<body>
			<h1>这是内容部分</h1>
		</body>
	</body>
</html>
META标记

meta标记是html语言的head部分的一个辅助性标记，它位于head和title标记之间，它提供给用户不可见的信息。meta标记是用来搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie，可以用来鉴别作者，设置页面格式，标注内容提要和一些关键字，还可以设置页面的自动刷新以及等级等

TITLE标记

在头部的中，有另一组标签，在这个标签对中的文字会出现在浏览器视窗最上方的蓝色部分里，作为网页的主题

文字上的分隔标记

浏览器不像word，不认识enter键或者空格键，所以有了分隔标记

  • 强制断行标记
  • 强制分段标记

  • 空格 “& nbsp;”
例1：<br>的使用
<html>
	<head>
		<title>分隔标记1</title>
	</head>
	<body>
		<body>
			我要换行了<br>
			我换行了
		</body>
	</body>
</html>

例2：<p>的使用
<html>
	<head>
		<title>分隔标记2</title>
	</head>
	<body>
		<body>
			我要换行了<p>
			我换行了</p>
		</body>
	</body>
</html>
    
例3：空格的使用
<html>
	<head>
		<title>分隔标记3</title>
	</head>
	<body>
		<body>
			我要空格了&nbsp;我空格了
		</body>
	</body>
</html>
排版的标记

  • 文字的置左、置右、置中

    在分段标记

    上加一些简单的属性设定，就可以让其文字置左、置右、置中

    <html>
    <head>
        <title>排版标记</title>
    </head>
    <body>
        <p align="left">
            我置左
        </p>
        <p align="center">
            我置中
        </p>
        <p align="right">
            我置右
        </p>
    </body>
</html>
说明：align是分段标记的属性之一，这个属性将来会常常在不同标记中出现，他的功能就是专门在设定“水平对齐的位置”，其常见的属性值有三个“align="left"”置左，“align=""center”置中，“align="right"”置右

  • 置中标记

    <html>
    <head>
        <title>置中标记</title>
    </head>
    <body>
        <center>我置中了</center>
    </body>
</html>
说明:这是一个经常用到的标记，除了文字外，还有图片，表格等等一些其他的标记，任何可以显示在网页中的东西他都可以置中

  • 保持原始数

    <html>
    <head>
        <title保持原始数据格式标记</title>
    </head>
    <body>
        <pre>
        	我
			    想
				    在
					    哪
					就
				在
			哪
        </pre>
    </body>
</html>
说明：利用“<pre>”标记可以将排版和格式后的内容原封不动的呈现出来
字体标记

  • 标题标记

    <h1>
    内容
</h1>
说明：标题的大小一共有6中，也就是从<h1>到<h6>,<h1>最大，<h6>最小。使用该标记时字体会变成粗体，并自成一行

  • 设置字体标记

    <font size="2" color="blue" face="楷书">内容</font>

  • 字体变化标记

    <b>加粗</b>
<i>斜体</i>
<u>底线</u>
<em>强调</em
最低0.47元/天 解锁文章
鹿秀儿
关注
专栏目录
html5知识点：超文本标记语言编程
关注我！带你一路 "狂飙" 到底！
11-21 4859
作为一个组织或者个人在万维网上放置开始点的页面称为主页（外语：Homepage）或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接），所谓超级链接，就是一种统一资源定位器（Uniform Resource Locator，外语缩写：URL）指针，通过激活（点击）它，可使浏览器方便地获取新的网页。标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。
HTML基础模板
qq_61690596的博客
07-18 2081
HTML基本模板，每个基础元素的内容和作用
HTML（超文本标记语言）
weixin_47183168的博客
12-07 653
HTML是HyperText Markup Language的简称，它是一种用于创建网页的标准标记语言。 标记语言是由标签构成的语言。例如html，xml；标记语言不是编程语言。 HTML 运行在浏览器上，由浏览器来解析。 标签的内部可以定义属性，属性由键值对组成，值需要用双引号引起来，多个属性用空格隔开 <标签名称 属性名1="属性值" 属性名2="属性值"></标签名称> <p id="p1" name="p1"></p> 基本结构 &lt.
HTML入门
weixin_44376565的博客
09-09 67
HTML入门
HTML 超文本标记语言——html笔记
小羊的博客
09-05 999
一、认识HTML 1. 概念 HTML（Hyper Text Markup Language），超文本标记语言，顾名思义，超文本就是除了文本还有其他类似于图片、音频、视频的标记语言。 1.1 超文本 超出文本之外的内容 文本 图片 音频 视频 …… 1.2 标记 无论是文本、图片、音频还是视频，想要将其呈现出来，就需要使用特殊的标记来进行表示。 2. 意义 2.1 网站的根本 各大网站均是由HTML语言所构建的。
access字段属性设置下拉列表_第一部分：HTML+CSSHTML+CSS之HTML属性
weixin_39575502的博客
11-20 456
一、HTML的基本语法1、<常规标记><标记 属性=“属性值” 属性=“属性值”></标记>例如：<head></head>2.空标记<标记 属性=“属性值” />例如：<常规标记也叫标签对（html,head,body,title）<常规标记 属性=“属性值” 属性=“属性值”></常规标记>空...
HTML基础练习题
weixin_50108821的博客
09-23 1万+
第一题 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>嘿嘿嘿</title> </head> <body> <table border="1" cellspacing="0" cellpadding="0"> <tr align="center">
《Web程序设计基础R》实验报告---HTML基础
一只小鹿的博客
12-21 4778
一、实验目的 1．掌握常用的HTML语言标记； 2．利用文本编辑器建立HTML文档，制作简单表单页面。 二、实验环境 计算机、Windows10 操作系统 三、实验内容、源码及运行结果 1．  实验内容 在文本编辑器“记事本”中输入如下的HTML代码程序，以文件名sy1.html保存，并在浏览器中运行。（请仔细阅读下列程序语句，理解每条语句的作用） 源程序清单如下： 1. <html> 2. <head> 3. <title>Example</title&
HTML基础网页布局代码写法
m0_51826406的博客
03-07 8786
W3C标准 W3C World Wide Web Consortium 万维网联盟 中立性技术标准机构 W3C标准包括 结构化标准语言（HTML XML） 表现标准语言（CSS） 行为标准（DOM ECMAScript） 在idea创建一个工程 开始学习HTML基础 <!--注释 DOCTYPE：告诉浏览器我们使用什么规范 --> <!DOCTYPE html> <html lang="en"> <!-- head代表网页头部 --> <hea
html+javascript的简单带文本框选择日期控件
09-20
简单的文本框日期控件，只需要一个js文件+文本框上一个触发事件。
HTML 字体设置代码
weixin_56140427的博客
11-19 6651
<!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>字体.
(整理)HTML字体标记:标题字体,字体大小,物理字体,逻辑字体,字体颜色,客户端字体,字符实体
轻雨漫步的专栏
03-26 1万+
HTML字体标记   HTML字体标记包括:标题字体,字体大小,物理字体,逻辑字体,字体颜色,客户端字体,字符实体等. 1.标题字体: ... #=1, 2, 3, 4, 5, 6 居中显示标题 设定标题背景颜色 2.字体大小:         #=1, 2, 3, 4, 5, 6, 7 or +#, -# #=1, 2,
html div标题字号,css – 根据div大小调整字体大小
weixin_42306054的博客
05-31 512
我做了这个jsfiddlehtml： headernot a lot of text here but still overflowing用css：html, body {height: 100%;width: 100%;}#launchmain {width: 55%;display: inline-block;position: relative;top:10%;left:25%;}#laun...
title 加样式_HTML中怎么设置h1的字体样式你知道吗？关于设置h1标签的样式详解-web前端教程...
weixin_39631689的博客
01-22 1087
本篇文章主要为大家讲解了html中的h1标签的样式解析，但是如果不用css样式来做的话，那就只能在html4.01中显示了，所以我们还是尽快学习css层叠样式表吧，好了，现在让我们来说说这篇文章吧。HTML中的H标签(H1，H2，H3等)用来标明一个页面中的标题层次系统。因此，Hl标签可以被当做整个网页的标题，H2标签就是小标题，H3是第三级标题等。搜索引擎对出现在H标签中的关键字有一点偏好，尤其...
如何在html中使用特殊字体
m0_47659279的博客
11-10 4887
前言一、下载字体文件（.ttf文件）二、在html中引入.ttf字体文件三、引入字体文件后就可以将该字体应用到你的文本上了完整代码示例 前言 html中自带的字体很多，足以满足我们大部分需求，但特殊情况下，我们需要使用特殊的字体，本文介绍了如何在你的html网页中使用特殊字体 不多BB，先上效果图： 接下来就教大家如何使用特殊字体 一、下载字体文件（.ttf文件） 百度搜索你想要的特殊字体的.ttf文件并把它下载到一个你能记住的目录中，例如我把华文彩云.tf(记得解压并拿出.ttf文件)下载进了C盘.
html里面修改title样式
weixin_33859231的博客
04-15 1万+
默认的title不能设置样式，通过js和css实现title的功能 css样式： <style> /*修改提示框*/ #mytitle { position: absolute; color: #ffffff; max-width: 160px; font-size: 14px; ...
【WEB】HTML标签自带属性title样式修改
热门推荐
逛街的喵啊
11-09 4万+
背景最近字体版权问题，公司的网站页面要统一换字体，Windows平台换成宋体（SimSun），Mac平台换成黑体（SimHei）。然后，偶然留意到title的默认提示框。title的样式是没法使用CSS进行设置的，所以使用了一种折中的方法，通过给document注册mouseover、mouseout、mousemove事件实现修改提示框。实现原理通过动态创建DIV，滞空HTML标签的title属性...
HTML基础入门与开发环境选择
HTML基础知识详解 在IT开发领域中，HTML（HyperText Markup Language）扮演着核心角色，它是网页制作的基础。本文将深入探讨JavaWeb开发中的两种主要模式——C/S（客户端/服务器）和B/S（浏览器/服务器），以及HTML...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值