整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

html版权符号代码怎么写?特殊符号利用html实现正常输出

信不少开发人员都会遇见这个问题,基本上每个网站都会有版权声明,其中会用到版权符号copyright:©,但是我们在开发的过程中,是不能直接以汉字输入©的,需要用到html代码来实现输出,否则显示是不正常的,那么我们应该怎么利用html代码来正常的输出版权符号“©”的呢?

如果我没有记错的话,html版权符号是©

下面再给大家推荐其他的html特殊字符编码

使用一个“&”后面带上特殊符指令,就可以了

接下来再看一下下面的这些特殊符号的转义写法

最后还有这些:

大家可以收藏下上面这些html符号编码,很有可能会用的到啊!

  • 文本标记语言(英文HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言!
  • 对于中文网页需要使用<meta charset='utf-8'>声明编码,否则会出现乱码。有些浏览器(如360浏览器)会设置GBK为默认编码,则你需要设置为<meta charset='gbk'>
    例子模板
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML中文网(html.cn)</title>
</head>
<body>
    <h1>我的第一个标题</h1>
    <p>我的第一个段落。</p>
</body>
</html>

解析

<!DOCTYPE html> 声明为 HTML5 文档
<html> 元素是 HTML 页面的根元素
<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题
<p> 元素定义一个段落

什么是HTML?

  • HTML 是用来描述网页的一种语言。
  • HTML 指的是超文本标记语言:HyperText Markup Language
  • HTML 不是一种编程语言,而是一种标记语言
  • 标记语言是一套标记标签 (markup tag)
  • HTML 使用标记标签来描述网页
  • HTML 文档包含了HTML 标签及文本内容
  • HTML文档也叫做 web 页面

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词,比如
<html>
HTML 标签通常是成对出现的,比如
<b></b>
标签对中的第一个标签是开始标签,第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签
<标签>内容</标签>

HTML 元素

“HTML 标签” 和 “HTML 元素” 通常都是描述同样的意思.
但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签,如下实例:
HTML 元素:
<p>这是一个段落。</p>

HTML 头部元素

头部元素包含关于文档的概要信息,也称为元信息(meta-information)。Meta 意为“关于某方面的信息”。
可以这么说,元数据(meta-data)是关于数据的信息,而元信息是关于信息的信息。

HTML <HEAD> 元素

<head> 元素包含了所有的头部标签元素。在 元素中你可以插入脚本(scripts), 样式文件(CSS),及各种meta信息。
可以添加在头部区域的元素标签为:
<title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.

HTML <TITLE> 元素

<title> 标签定义了不同文档的标题。
<title> 在 HTML/XHTML 文档中是必须的。
<title> 元素:
1.定义了浏览器工具栏的标题
2.当网页添加到收藏夹时,显示在收藏夹中的标题
3.显示在搜索引擎结果页面的标题

HTML <BASE> 元素

<base> 标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:

<head>
<base href="http://www.html.cn/images/" target="_blank">
</head>

HTML <LINK> 元素

<link> 标签定义了文档与外部资源之间的关系。
<link> 标签通常用于链接到样式表:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

HTML <STYLE> 元素

<style> 标签定义了HTML文档的样式文件引用地址.
<style> 元素中你也可以直接添加样式来渲染 HTML 文档:

<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>

HTML <META> 元素

meta标签描述了一些基本的元数据。
<meta> 标签提供了元数据.元数据也不显示在页面上,但会被浏览器解析。
META 元素通常用于指定网页的描述,关键词,文件的最后修改时间,作者,和其他元数据。
元数据可以使用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他Web服务。
<meta> 一般放置于 <head> 区域

<META> 标签- 使用实例

  • 为搜索引擎定义关键词:
    <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
  • 为网页定义描述内容:
    <meta name="description" content="免费 Web & 编程 教程">
  • 定义网页作者:
    <meta name="author" content="HTML">
  • 每30秒钟刷新当前页面:
    <meta http-equiv="refresh" content="30">

HTML <SCRIPT> 元素

<script>标签用于加载脚本文件,如: JavaScript。
<script> 元素在以后的章节中会详细描述。

HTML head 元素

标签

描述

<head>

定义了文档的信息

<title>

定义了文档的标题

<base>

定义了页面链接标签的默认链接地址

<link>

定义了一个文档和外部资源之间的关系

<meta>

定义了HTML文档中的元数据

<script>

定义了客户端的脚本文件

<style>

定义了HTML文档的样式文件

HTML 元素

  • HTML元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。例:

开始标签

元素内容

结束标签

<p>

这是一个段落

</p>

<a href="default.html">

这是一个链接

</a>

<br>

换行


  • 说明:HTML 文档是由 HTML 元素定义的
  • 注:开始标签常被称为起始标签(opening tag),结束标签常称为闭合标签(closing tag)。

元素语法

  • HTML 元素以开始标签起始
  • HTML 元素以结束标签终止
  • 元素的内容是开始标签与结束标签之间的内容
  • 某些 HTML 元素具有空内容(empty content)
  • 空元素在开始标签中进行关闭(以开始标签的结束而结束)
  • 大多数 HTML 元素可拥有属性
  • 注释: 您将在本教程的下一章中学习更多有关属性的内容。
  • 嵌套的 HTML 元素
  • HTML 文档由嵌套的 HTML 元素构成。大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)。
  • 空元素
  • 没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
  • <br> 就是没有关闭标签的空元素(<br> 标签定义换行)。
  • 在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。
  • 在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。
  • 即使 <br> 在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。

注释标签<!--...-->

HTML注释标签<!--...-->用来在源文档中插入注释。注释不会在浏览器中显示。可使用注释对您的代码进行解释,这样做有助于您在以后的时间对代码的编辑。特别是代码量很大的情况下很有用

标签定义及使用说明

  • <!--...--> 注释标签用来在源文档中插入注释。注释不会在浏览器中显示。
  • 您可使用注释对您的代码进行解释,这样做有助于您在以后的时间对代码的编辑。特别是代码量很大的情况下很有用。
  • 您也可以在注释内容存储针对程序所定制的信息。在这种情况下,这些信息对用户是不可见的,但是对程序来说是可用的。一个好的习惯是把注释或样式元素放入注释文本中,这样就可避免不支持脚本或样式的老浏览器把它们显示为纯文本。
<script type="text/javascript">
<!--
function displayMsg()
{
  alert("Hello World!")
}
//-->
</script>
  • 注释:命令行最后的两个正斜杠(//)是 JavaScript 注释符号。这确保了 JavaScript 不会执行 –> 标签。
  • 除了在源文档中有非常明显的作用外,许多 Web 服务器也利用注释来实现文档服务端软件特有的特性。这些服务器可以扫描文档,从传统的 HTML/XHTML 注释中找到特定的字符序列,然后再根据嵌在注释中的命令采取相应的动作。这些动作可能是简单地包括其他文件中的文本(即所谓的服务器端包含,server-inside include),也可能是复杂地执行其他命令去动态生成文档的内容。

HTML 段落与文字

标题

  • 在 HTML 文档中,标题很重要。标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。其中<h1> 定义最大的标题,<h6> 定义最小的标题
  • HTML中的标题标签通过<h1>-<h6>来设置,越往下标题越小

段落

  • 在HTML中段落是通过p标签来定义的,它可以将HTML文档分割为若干段落部分。因为p标签是块级元素,所以浏览器会自动地在段落的前后添加空行。
  • 注意: 因为p标签是块级元素,所以浏览器会自动地在段落的前后添加空行
  • 我们可以通过<br/>标签来对段落进行换行
  • 如果希望在不产生一个新段落的情况下进行换行,就可以使用<br /> 标签,注意它是一个单标签。

文本格式化

  • HTML可定义很多供格式化输出的元素,例:使用标签 <b>(“bold”) 与 <i>(“italic”) 对输出的文本进行格式,从而显示粗体 或者 斜体
    示例:
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>HTML教程(html.cn)</title> 
</head> 
<body>
<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br>
这是 <sub> 下标</sub> 和 <sup> 上标</sup>
</body>
</html>

HTML 文本格式化标签

标签

描述

<b>

定义粗体文本

<em>

定义着重文字

<i>

定义斜体字

<small>

定义小号字

<strong>

定义加重语气

<sub>

定义下标字

<sup>

定义上标字

<ins>

定义插入字

<del>

定义删除字

HTML”计算机输出”标签

标签

描述

<kbd>

定义键盘码

<samp>

定义计算机代码样本

<var>

定义变量

<pre>

定义预格式文本

<code>

定义计算机代码

HTML 引文,引用,及标签定义

标签

描述

<abbr>

定义缩写

<address>

定义地址

<bdo>

定义文字方向

<blockquote>

定义长的引用

<q>

定义短的引用语

<cite>

定义引用、引证

<dfn>

定义一个定义项目

区块

  • 大多数 HTML 元素被定义为块级元素或内联元素。块级元素在浏览器显示时,通常会以新行来开始(和结束);而内联元素则不会。

HTML 区块元素

可以通过 <div> 和 <span> 将 HTML 元素组合起来

HTML块级元素

块级元素在浏览器显示时,通常会以新行来开始和结束 - 例:<h1>, <p>, <ul>, <table>

HTML内联元素

内联元素在显示时通常不会以新行开始 - 例:<b>, <td>, <a>, <img>

HTML <div> 元素

HTML <div> 元素是块级元素,浏览器会在其前后显示折行 - 如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性。 - <div> 元素的另一个常见的用途是文档布局

HTML <span> 元素

HTML <span> 元素是内联元素,可用作文本的容器 - 与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性

HTML字符实体

  • 在 HTML 中,某些字符是预留的,这些预留字符必须被替换为字符实体;而,一些在键盘上找不到的字符也可以使用字符实体来替换。

HTML 实体
在 HTML 中,某些字符是预留的。
比如在 HTML 中不能使用小于号(<)和大于号(>)因为浏览器会误认为它们是标签,所以希望能正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体(character entities)。
字符实体类似这样

&entity_name;

&#entity_number;

HTML 字符实体
不间断空格
HTML 中的常用字符实体是不间断空格( )
浏览器总是会截短 HTML 页面中的空格,如果需要在页面中增加空格的数量,需要使用 字符实体

有用的字符实体

显示结果

描述

实体名称

实体编码


空格



<

小于号

<

<

>

大于号

>

>

&

和号

&

&

引号

"

"

撇号

' (IE不支持)

'

¢

¢

£

£

£

¥

¥

¥

欧元

§

小节

§

§

©

版权

©

©

®

注册商标

®

®

商标

×

乘号

×

×

÷

除号

÷

÷

  • 注意:实体名称对大小写敏感

欢迎大家提议、分享、交流、共同学习进步

、html概述

1、html标签是用来给文本添加语义的,而不是用来修饰文本的;

2、<meta charset="GBK">指定字符集(GB2312、UTF-8),html保存和指定字符一样,才不会乱码;

3、<!DOCTYPE html> DTD文档申明告诉浏览器我用的什么协议来写的,不是html标签;

4、webstorm快捷键大全:https://www.cnblogs.com/yeminglong/p/5995421.html

二、基础标签

1、h、p 和 hr 标签

  • 三个标签都是占一行

2、注释:<!-- -->

3、图片:<img src=" ">

  • 不会独占一行;
  • 保证不变形,指定宽或者高即可;
  • title 和 alt 属性;
  • src 可以是相对路径(../ 上一级)和绝对路径,路径中尽量不含中文,相对路径不可跨盘符,路径分隔统一写 / ,绝对路径的可移植性不好;

4、换行:<br> 用于内容未完的换行

5、跳转:<a href=" "></a>

  • 支持文字和图片的跳转;
  • 地址必须加 http 或者 https;
  • href 可以指定本地的地址;
  • target(_self 和 _blank) 属性控制跳转是否打开新的选项卡;
  • title 提示作用;

6、base 标签:<base target="_self ">

  • 统一指定 a 标签怎么打开,写在 head 中

7、假链接:点击不会跳转

  • a 标签的 href 属性值为 # 或者 javascript
  • # 会跳转到页面的顶部,而 js 不会

8、锚点:<a href="#id值"><\a>

  • 可以跳转到页面的指定位置
  • 可以跳转到其他页面的指定位置,只需在 # 前面加上页面的路径即可
  • 跳转无过度动画

三、列表标签

1、无序列表(!)

  • <ul><li><\li><\ul>;
  • 整体不可分割;
  • ul 除了 li 不建议再加其他的标签,li 标签中可以放其他标签来丰富内容;
  • li 中还可嵌套列表;
  • ws快捷生成 ul>li*3>h2+p;

2、有序列表(*)

  • <ol><li><\li><\ol>;

3、定义列表

  • dt 是标题,dd 是具体的描述;
  • 推荐一个 dt 一个 dd ,也可以一个 dt 对多个 dd 或者没有 dd;
  • dl 中不建议加其他标签,二 dt 和 dd 可以加;
  • 应用:网站尾部,图文混排(仿京东做个网站的尾部);

四、表格标签

1、格式

  • 表格的边框默认不显示(border)

2、属性

(1)宽高

  • table 和 td 可用;
  • 默认高宽根据内容调整;
  • td 设置高宽只会改变当前单元格的状态,而不会改变 table 的高宽;

(2)水平和垂直对齐(align 和 valign)

  • 水平对齐三个都可以用,而垂直对齐针对 tr 和 td;
  • table 设置 align 控制表格在水平方向的对齐,给 tr 和 td 设置都是控制单元格里的内容的对齐方式,不过 tr 影响一行,td 影响一个,tr 和 td 都设置 td 会覆盖 tr 的效果;
  • tr 和 td 设置 valign 都是控制单元格内容的垂直方向的对齐,不过 tr 影响一行,td 影响一个,tr 和 td 都设置 td 会覆盖 tr 的效果;

(3)内边距和外边距(cellpadding 和 cellspacing)

  • 两个属性都是 table 的;
  • 外边距是指格子与格子之间的空隙,而内边距是指格子与文字之间的间隙;

(4)细线表格

  • 先给 table 设置 bgcolor;
  • 再给 tr 设置 bgcolor;
  • 最后 table 设置 cellspacing;

3、表格的其他标签

(1)caption:表格的标题标签,必须写在 table 内而且需紧跟 table

(2)th:th 和 td 同级,th 有加粗的效果

4、表格的结构

(1)组成:caption 标题、thead 表头、tbody 主体、tfoot 尾部

(2)说明:

  • 浏览器自动添加 tbody;
  • table 设置高度后,tfoot 和 thead 的高度是不会变化的;

5、单元格的合并

(1)水平方向:td 属性 colspan = "2";

(2)垂直方向:td 属性 rowspan = "2";

五、表单标签

1、格式

2、input 标签

(1)type = text:

(2)password:

(3)radio:互斥要设置 name 相同;默认选中 checked

(4)checkbox:选中 checked

(5)button:

(6)image:

(7)reset:value 修改标题

(8)submit:

  • form 的 action 确定提交的地址
  • 提交数据加 name 属性

(9)hidden:

-----------------------------------------------------------------------------------------------------------------------

*相关标签:

  • label 标签:让文字与 input 标签绑定;两种绑定的方式:

  • datalist 标签:给输入框绑定输入的提示:<datalist><option>haha</option></datalist>
  • h5 中新增的 input 标签:email 、url 、number 、color、date(浏览器的支持不好)

3、非 input 标签

(1)select

(2)textarea

  • cols 和 rows 指定输入的行列,但是还是可以无限输入
  • 默认可拉伸,也可通过 css 固定大小

4、练习

(1)表单标签除了 button 外都可以用 value 来指定提交的值

(2)表单添加边框可以在 form 中添加 fieldset 来实现

六、多媒体标签

1、video 标签

(1)格式:<video src=" " autoplay="autoplay"></video>;

(2)属性:controls(控制条)poster(海报)loop(循环)preload(预加载,与autoplay冲突)muted(静音)width/height;

3)另一种 video 格式:解决浏览器的兼容

(4)让所有的浏览器支持 video 标签:通过 js 框架来实现

2、audio 标签

(1)使用基本和 video 一样,属性只有宽高和 poster 不能用,也是两种格式

3、details 和 summary 标签

(1)格式:

4、marquee标签(跑马灯效果)

(1)w3c 不推荐,但是浏览器的支持好

(2)属性:direction(方向)scrollamount(滚动的速度)loop(滚动次数,默认-1)behavior(滚动类型 slide)

(3)废弃的标签:<br><hr><font><b>加粗<u>下划线<i>斜体<s>删除线(无语义)

替代的标签:<strong><ins><em><del>(加入了语义)

5、字符实体

(1)&nbsp;空格 &lt;&gt; &copy;版权符号

(2)理解:html 占用了的不显示的特殊字符用另外的代替符号表示,使他们正常在 html 页面上显示