当前位置:首页 > 科技 >

html链接怎么打开(html如何打开新链接)

来源:原点资讯(www.yd166.com)时间:2023-04-17 02:28:13作者:YD166手机阅读>>

一、Html概述

Html是Hyper Text Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的语言,这种语言由一个个的标签组成,用这种语言制作的文件保存的是一个文本文件,文件的扩展名为html或者htm,一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用文本的方式编辑它,如果用浏览器打开,浏览器会按照标签描述内容文件渲染成网页,显示的网页可以从一个网页链接跳转到另一个网页。 二、Html标签语法

html中标签分为 :成对标签和自闭合标签【空标签】

1、成对标签

成对出现,有开始标签必须有结束标签,内容包裹在两个标签中,而且开始标签名和结束标签名一致,并且结束标签必须以斜杠/开头

语法:

<font>内容</font> 2、自闭合标签

只有一个标签,用斜杠结束,斜杠也可以省略

语法:

<br/>

注意事项:

  • 成对标签中,结束标签必须以斜杠开头
  • 成对标签与成对标签可以嵌套不能交叉
  • 标签名不区分大小写,但是我们都必须小写
三、Html基本架构

<!DOCTYPE html> <html lang="en"> <head> <title></title> </head> <body> </body> </html> 1、!DOCTYPE

!DOCTYPE html是文档声明,定义文档类型为html,并且告诉不同的浏览器用标准方式进行解析html语言,如果不写的话,会产生怪异模式,所谓怪异模式,就是浏览器会用自己的方式进行解析,不同的浏览器有各自的解析方式,从而会出现无效果、不兼容等问题。

注意,html中有两种声明类型,一种叫做xhtml,即html,另一种叫做html5,html5是xhtml的升级版,所以我们建议使用html5的声明方式

xhtml声明方式:

<htmlxmlns="http://www.w3.org/1999/xhtml">

html5声明方式:

<!DOCTYPE html>

2、html

html是html文档的整体,也就是表示一个网页。

html中的lang="en"是定义该文件语言是英文

3、head

head是html的第一层子元素【子标签】,负责对网页进行一些设置以及定义标题,设置包括定义网页的编码格式,外链css样式文件和JavaScript文件等。设置的内容不会显示在网页上,标题的内容会显示在标题栏中。即title标签。

4、meta

meta是html语言head标签中的一个辅助性标签,该标签不包含任何内容,但是该标签的属性定义了与文档相关联的名称,比如:编码

<meta charset="utf-8"></meta> 5、body

body也是html的第一层子元素,我们页面中显示的所有内容全部都是编写在该标签体中。

四、Html文档规范

html制定了文档的编写规范,必须遵守。

所有的标签必须小写

所有的属性必须用双引号括起来

五、Html注释

html文档代码中可以插入注释,注释是对代码的说明和解释,注释的内容不会显示在页面上。

注释的语法:

<!-- 注释的内容 -->

六、html基本属性

注:属性是标签的辅助作用。

属性 描述 bgcolor 设置网页的背景颜色 background 设置网页的背景图片

1.bgcolor

设置网页的背景颜色

<!DOCTYPE html> <html lang="en"> <head> <title>html的属性</title> </head> <body bacolor="pink"> </body> </html> 2.路径

我们在开发网页时,需要经常的插入图片、视频、文件等一些操作,但是我们需要指定文件所在的位置,这个位置就是所谓的路径

路径分为:

  1. 相对路径 指目标相对于当前文件的路径,网页结构设计中多采用这种方式来表示目标的路径。相对路径有多种表示方法,其表示的意义不尽相同。表示方法如下: ./ :代表文件所在的目录(可以省略不写)../ :代表文件所在的父级目录../../ :代表文件所在的父级目录的父级目录/ :代表文件所在的根目录【/ : 可以理解为目标文件的绝对路径】
  2. 绝对路径 指目标文件的完整路径,从盘符开始。
3.background

设置网页的背景图片

<!DOCTYPE html> <html lang="en"> <head> <title>html的属性</title> </head> <body background="../images/10.jpg"> </body> </html>

注意事项:

bgcolor和background不能同时使用

background不能指定绝对路径

七、Html标签1.网页的组成

网页的组成:文字、图片、视频、超链接、列表、表格、表单等组成。

2、文本段落标签

标签 描述 hn 设置文字标题【n:取值范围 1~6】 center 居中对齐 hr 水平线 属性(width:宽度 color:颜色 size:粗细) br 换行 p 段落

3、文本控制标签

标签 描述 font 设置字体,需要借助属性设置

属性 描述 color 设置字体颜色 size 设置字体大小,不需要带单位,取值范围:1~7【浏览器默认值:3】 face 设置字体风格

<font size="2" color="red" face="黑体"></font> 4、文本格式化标签

标签 描述 b 定义粗体文本 em 定义着重文字 i 定义斜体文字 small 定义小号字 strong 定义加重语气 sub 定义下标字 sup 定义上标字 ins 定义插入字 del 定义删除字

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Html文本格式化标签</title> </head> <body> <b>粗体文本</b> <i>倾斜文本</i> <em>着重文本</em> <small>小号字</small> <strong>加重语气</strong> <sub>上标</sub> <sup>下标</sup> <ins>插入字</ins> <del>删除字</del> </body> </html> 5、图片标签

在Html中,图像由

标签定义。

是空标签,意思是说,它只包含属性。

要在页面上显示图像,你需要使用源属性(src)。src指"source"。源属性的值是图像的URL地址。

标签 描述 img 图片标签

属性 描述 src 指定图片的地址 width 设置图片的宽度 height 设置图片的高度 alt 设置图片的预备文本

注意事项:不建议设置图片大小,容易失真

6、audio

在Html中,声音由标签定义。

标签 描述 audio 声音标签

属性 描述 src 指定声音地址

<audio src="nice.mp3">对不起,您的浏览器不支持</audio> 7、video

在Html中,视频由video标签定义

标签 描述 video 视频标签

属性 描述 src 指定视频地址

<video src="美女.mp4">对不起,您的浏览器不支持</video> 8、超链接

a标签定义超链接,用于从一个页面链接到另一个页面。

a标签最重要的属性是href,它指定链接的目标。

在所有浏览器中,链接的默认外观如下:

未被访问的链接带有下划线而且是蓝色的

已被访问的链接带有下划线而且是紫色的

活动链接带有下划线而且是红色的

语法:

<a href="链接目标">点击内容</a>

属性 描述 href 指定链接目标 name 指定锚的名称 download 指定下载链接 target 指定跳转方式 属性值 描述 _blank 新窗口打开【常用】 _parent 在父窗口中打开链接【了解】 _self 默认,在当前窗口打开【了解】 _top 在当前窗体打开链接,并替换当前的整个窗体【了解】 framename 到 iframe 在讲【常用】

超链接分类:

  • 内部链接 链接目标:本地页面 <a href="demo.html">点击内容</a>
  • 外部链接 链接目标:外部页面 <a href="http://www.baidu.com">点击内容</a>
  • 多媒体链接 链接目标:图片、视频等 <a href="images/美女.jpg">点击内容</a>
  • 电子邮件链接 链接目标:电子邮件【系统自带的电子邮件】 <a href="mailto:12345@qq.com">点击内容</a>
  • 锚链接 链接目标:锚点 1.建立锚点
    <a name="锚点名"></a>

    2.跳转
    <a href="#锚点名">点击内容</a>
9、列表

列表的使用与word等软件的列表概念相似,只不过是应用在网页展示中。

1.有序列表

有序列表是指有数字编号或字母的列表项,可以使用css定义更多样式。

<!-- 有序列表 --> <ol type="a"> <li>新闻一</li> <li>新闻二</li> <li>新闻三</li> </ol>

html链接怎么打开,html如何打开新链接(1)

属性 描述 type 设置符号类型 值:1 a A I i 默认数字 start 从第几个开始【用于ol标签中】 value 从第几个开始【用于li标签中】

<!-- 有序列表 --> <ol type="a" start="4"> <li>新闻一</li> <li type="1" value="1">新闻二</li> <li>新闻三</li> </ol>

html链接怎么打开,html如何打开新链接(2)

2、无序列表

无序列表是指没有数字编号或字母的列表项,可以使用css定义更多样式。

<!-- 无序列表 --> <ul> <li>童装</li> <li>男装</li> <li>女装</li> </ul>

html链接怎么打开,html如何打开新链接(3)

属性 描述 type 用于设置符号类型,默认:实心圆 值:空心圆、正方形 【用于ul、li】

<!-- 无序列表 --> <ul type="square"> <li>童装</li> <li type="circle">男装</li> <li>女装</li> </ul>

html链接怎么打开,html如何打开新链接(4)

栏目热文

html默认打开方式无法更改(默认html打开文件怎么取消)

html默认打开方式无法更改(默认html打开文件怎么取消)

微软正在恢复 Windows 11 中的更改,该更改使得通过系统设置更改默认浏览器变得更加困难。在本周早些时候发布的 W...

2023-04-17 02:27:28查看全文 >>

html页面运行不出来怎么办(html代码正确却运行不出来)

html页面运行不出来怎么办(html代码正确却运行不出来)

1. HTML及CSS:HTML是网页的基础,学习HTML可以了解网页的基本结构,CSS可以定义网页的样式、布局和外观;...

2023-04-17 01:57:16查看全文 >>

html打开无法显示网页怎么回事(html打开不显示怎么办)

html打开无法显示网页怎么回事(html打开不显示怎么办)

当我们访问网站成功后,网站服务器会发送给我们网页代码,浏览器看到代码后,就解释成,我们平时看到的,有文字、图片、视频等的...

2023-04-17 02:26:19查看全文 >>

html链接打不开(自己做的html网页打不开)

html链接打不开(自己做的html网页打不开)

超链接链接分为两种,第一种是指向自己网站的另一个页面,另一种是指向其他的网站;创建超链接,首先创建一个<a>...

2023-04-17 02:30:12查看全文 >>

男孩身高猛长期哪几年(男童吃什么长高)

男孩身高猛长期哪几年(男童吃什么长高)

文/糖妈 原创,抄袭必究。更多的母婴知识可关注本号,欢迎个人分享与关注、点赞每个父母都希望自家的孩子,能将来长得高高大大...

2023-04-17 01:55:04查看全文 >>

为什么我的html网页打不开(为什么我的html打开无法显示网页)

为什么我的html网页打不开(为什么我的html打开无法显示网页)

一、网络问题1、本地网络不通。解决方法:网站不能访问首先看看其他的网站是否能正常访问,如果同样不能访问,请拨打当地网络服...

2023-04-17 02:07:01查看全文 >>

写的html代码无法打开怎么办(html文件打开显示无法访问咋解决)

写的html代码无法打开怎么办(html文件打开显示无法访问咋解决)

在html网页中显示html代码方法1<textarea> 这里是代码<!DOCTYPE HTML&g...

2023-04-17 02:34:59查看全文 >>

html怎么用链接打开(html如何打开外部链接)

html怎么用链接打开(html如何打开外部链接)

在单击带有超链接的文件时,超链接的内容有多种,打开方式,如替换当前页打开,在新窗口打开等。而用来指定打开方式的是<a&g...

2023-04-17 01:58:13查看全文 >>

html网页打不开怎么办(html网页打开是空白怎么办)

html网页打不开怎么办(html网页打开是空白怎么办)

核心技术点网页组成排版标签多媒体标签及属性综合案例一 - 个人简介综合案例二 - Vue 简介一、标签语法HTML 超文...

2023-04-17 02:44:47查看全文 >>

html的打开方式变不了(html代码正确却运行不出来)

html的打开方式变不了(html代码正确却运行不出来)

大家好,我是 Echa。本文将带你了解 Javascript 中常见的错误类型,处理同步和异步 JavaScript/N...

2023-04-17 02:14:05查看全文 >>

文档排行