HTML基础

文章介绍了Web开发中的前端基础知识,包括HTML用于构建页面结构,CSS负责样式布局,JavaScript处理交互逻辑。资源类型涵盖多媒体如图片、音频、视频,以及纯文本和结构化数据。Web浏览器从后端获取资源并处理,前端开发者关注HTML、CSS和JavaScript的使用,理解资源间的关系和格式标准。
摘要由CSDN通过智能技术生成

资源根据内容的格式不同,也可以看作不同的类型(无穷多个类型),常见的有:

1.HTML格式  Hyper Text Markup Language  起文本标记语言 web应用中用于框架和内容,图纸,相当于为毛坯房。

2.css 格式 Cascading Style Sheets 层叠式表 web 应用中的显示布局和样式,装修,相当于让房子好看。

3.JavaScript 格式 运行在预览器的一门语言 js脚本 web 应用中做逻辑处理,相当于房子中的人。

4.多媒体格式

1)  图片  jpg jpeg png gif webp bmp

2)  音频   aac,MP3....

3)视频 MP4  mpeg4 flv mkv ...

5.纯文本格式  txt 

6.结构化数据 json,xml

从web的前端(frontend):了解html ,css ,javascript的使用

进入web开发的世界

浏览器 想办法把html css javascript 内容以资源为单位从 后端 (web 服务器)中获取过来,之后所有的工作在浏览器内部完成。

 

 web开发不在意后端以什么语言来写,只要能返回资源 和按照标准的http协议,和标准流程(先找到主机,再找到端口(进程),再找到资源),把内容返回回来就无需在意用什么语言来写。前端就统一格式。

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

1.超文本  比一般的文本能力更强。对比txt文本,可以有超链接(hyper link)
2.怎么理解标记  对比txt文本 

 

 就是可以去标注,强调·,通过如下:

 通过<h1> </h1>(标签 tag)把美好的一天标注出来了,将美好的一天标注为h1,全程header1(一级标题)

 

HTML中的标签是有规定的,并不是任何都有可以(最新的标准允许自定义标签)

通常标签是 (开始标签 ,内容, 闭合标签 ) 有部分是单一标签。

 HTNL的结构也是有规定,虽然大多数浏览器兼容不符合规定格式,但对于我们来说尽量去符合格式。IDEA是可以帮我们生成内容的,一般写出来都符合格式。

 通过标签,将文本视为一颗树,标签允许有属性(attributes)存在放在 开始标签里 基本格式是 key =value 的形式 注意 key=value 注意这个等号两边没有空格,其中,key不需要引号引起来,

value 需要引起来,单/双引号均可

<html lang = "us_en">  美国英语

<html lang = "zh_hans">  中国汉字

<meta charset="utf-8">  代表htnl字符集使用utf-8

 快捷键 !tab  , h1大括号+内容+tap

一些常见标签

Array - JavaScript | MDN  mozilla组织(firefox的开发团队)

1)文本类型的标签

表示标题类型的标签

 2)段落 paragraph  其中在html里的换行,空格最终显示的时候都是视为一个空格

html有些标签自带换行的(这种标签一般称为 块级标签(block))还有一类标签是不带换行的,一般称为内联标签(inline)比如h1 - h6,p 都是块级标签,自带换行。

<br>  break  单一标签,光写<br> ,不用写闭合。作用换行

 3)多媒体标签

1.插入一个图片资源(多个资源配合)

 <img> 是单一标签,关键属性是src=“图片资源的路径”  如果路径不正确,或者不支持访问,网页不会正常显示

<img src="...."> (其中.... 代表的是 图片资源的url)

2.图片资源是我们的静态资源

 

 

关于资源的路径表示:

资源路径是

 

 

 

 小结:

<img src = ".....">

引入图片资源的路径时,可以指定同一个web 服务器管理的资源,在这个前提下

1.可以写完整的路径  http://127.0.0.1:8080/img/rc.jpg

2.可以写完整大的路径   //127.0.0.1:8080/img/rc.jpg

3.可以省略协议+主机号

 3.1绝对路径 

 3.2 相对路径

   在写路径的时候  ..代表回到父节点  .代表当前结点不动

也可以直接引入外部资源,不是同一个的web服务器管理的资源,只能写 1.完整路径 2.省略协议号

其中 <img src ="...."> 已经开始出现几个资源配合的问题了  如下:

<audio src ="...."></audio>  可以引入音频资源 

<vidio src ="...."></audio>    可以引入视频资源 

<a>  anchor    锚点/超链接    href hyper referenec 的缩写 超链接 

 web应用(看到的一个页面----场景)是由多个资源配合完成,其中,并不是要求资源都是来自同一个web服务器

浏览器需要请求多个资源,根据

主机,端口,资源路径

web开发的核心:准备各种各样的资源以及资源之间的相互关系

资源从出生方式的角度:静态资源vs动态资源

从内容格式的角度:纯文本,html,css,javascript,图片,音频,视频,json资源

HTML属于前端的范畴,主要起到提供页面的结构和基本内容,

标签 <h1 id = "属性"></h1>    常见标签  h1—h6 ,p ,img ,a 

HTML本质就是一颗树形结构  

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值