走进HTML

98 阅读2分钟

HTML:Hyper Text Markup Language(超文本标记语言)

HTML文件的基本结构:文字,图片,音频,视频,超链接

W3C标准:不同浏览器的渲染引擎不同,对于相同的代码解析效果也存在差异,web标准使页面统一

编写HTML文档时遵守W3C标准,W3C是制定和维护统一的国际化Web开发标准的组织;

标准构成:结构☞HTML (页面元素和内容)

表现☞CSS(页面样式)

行为☞JS(页面交互)

网页基本标签:

1667637220072.jpg

1667637155136.jpg

超链接标签

文本超链接

页面间链接

超链接==》跳转页面的

a:超链接标签

属性 ===》标签中的内容

href : 指向跳转的地址

target : 设置是否跳转新页面

_self :默认值,在自身页面中跳转新页面

_blank : 跳转到新的页面

锚链接

锚链接的作用:就是快速找到对应的内容

第一种:A甲 跳 A乙 (同一个页面的不同位置之间的跳转)

语法:

1: <a href="#123">查找</a> // href 的属性值 必须要加上 #

2: <a name="123">查找内容</a>

第二种:A甲 跳 B乙 (2个页面之间的跳转查找内容)

语法:

1: <a href="跳转网址 #123">查找</a>

e.g:

<a href="./index04.html #123">查找</a>

2: <a name="123">查找内容</a>

注意:

他们的区别在于,2个页面之间跳转 href 需要加跳转网址,其他不变。

图像超链接

img:图片标签

属性

src : 图片的跳转地址

alt : 当图片加载不出来时的文字提示

title : 图片提示文字

width : 图片宽

height :图片高

<img src="image/hetao.jpg" width="160" height="160" alt="无漂白薄皮核桃" title="无漂白薄皮核桃"/>

图片路径 放在image或images目录下

行内元素和块元素的特性

块元素(div p h1~h6......):

无论内容多少,该元素独占一行;

行内元素(a img strong span em......):

内容撑开宽度,左右都是行内元素的可以排在一行。