vue 做pc网站,建设网站公司网站,维护网站建设,做网站公司做网站公司HTML零基础自学笔记#xff08;上#xff09; 参考#xff1a;pink老师一、HTML, Javascript, CSS的关系是什么?二、什么是HTML?1、网页#xff0c;网站的概念2、THML的基本概念3、THML的骨架标签/基本结构标签 三、HTML标签1、THML标签介绍2、常用标签图像标签#xff… HTML零基础自学笔记上 参考pink老师一、HTML, Javascript, CSS的关系是什么?二、什么是HTML?1、网页网站的概念2、THML的基本概念3、THML的骨架标签/基本结构标签 三、HTML标签1、THML标签介绍2、常用标签图像标签单标签链接标签 四、特殊字符 参考pink老师
一、HTML, Javascript, CSS的关系是什么?
举一个很平常的列子在我们平时上网冲浪在浏览器中搜索一个关键词时。也同时调用了他们打个比方我要使用百度该网页来查询今天天气。 当我们打开百度网页时所看到的首页的基本结构就是由HTML文件所书写的在有了基本结构的基础上前端人员会在使用CSS为基础结构再次润色对基本结构的颜色样式进行设置这一步会使所展示在我们面前的网页更加的美观。除此之外我们要在百度网站上进行搜索点击等操作与该页面进行一个交互这就时JavaScript的范畴了。 总结一下将前端拟人化来看HTML就是人的骨架组成CSS是人的外观展示样貌、肤色等JavaScript则是进行具体的动作
二、什么是HTML?
1、网页网站的概念
网站是网页的集合体。拿百度网站举例:https://www.baidu.com/ 是百度网站可以通过该网站搜索词条查看新闻查看视频图片这些通过百度网站所点击搜索的网页都是被百度网站的子集。 本质上来说网页是文本、图片、视频、音频等元素的集合。
2、THML的基本概念
HTML是超文本标记性语言(Hyper Text Markup Language) 是一种用来描述网页的语言。 上面说到网页是文本、图片等元素的集合。而HTML的作用就是编写想要呈现到网页上的元素的一种语言。网页实际上就是html文件用户通过浏览器的可以直接看到html文件所呈现出的数据。
3、THML的骨架标签/基本结构标签 要想书写HTML文件首先得搞清楚HTML的骨架标签的含义是什么才知道该从哪里入手。
DPCTYPE 表示文件类型文档类型声明标签。html页面中的最大标签也称为根标签。后面的lang代表该HTML页面的书写语言zh-CN定义语言为中文。meta charset meta标签是用来描述文档[[元数据]]的元素标签。charset定义文档的字符编码 UTF-8为万国码基本上的字符都可以被识别。head 文档的头部在head标签中必须要设置的是title标签title文档的标题–页面的网页标题body文档的主体页面基本内容都是放在body标签中
三、HTML标签
1、THML标签介绍
标签的语法规范以及标签类型标签大多数都为双标签有一首部分的标签为单标签。 双标签其语法格式为html /html 第一个尖括号为开始标签第二个尖括号结束标签 单标签语法格式br / 只有一个标签标签关系 标签关系分为包含关系和并列关系也成为父子关系和兄弟关系
headtitle /title
/head
body
/body其中head标签与body 标签为兄弟关系head 标签与title 标签为父子关系。
2、常用标签
标签名称标签类型标签释意标题标签双标签h1~h6,将文本格式变成标签格式从1-6字体依次减小 语法格式:h1 .../h1段落标签双标签将文本设置为一个段落段落与段落之间会有空行隔开。语法格式:p.../p换行标签单标签该标签所在行将进行换行强制重启一行。语法格式: br空一格/divspan标签双标签该标签是一个盒子标签无语义用来装饰页面的可以存放图片等。语法格式div.../divspan.../span图像标签单标签用来定义在html文件中的图像img src图像URL /详情可下滑查看链接标签双标签用来连接可以跳转的文本或者图像a href跳转目标 target目标窗口的弹出方式 文本或图像 /a详情可下滑查看
文本格式化标签标签名,为双标签标签释意加粗使文本加粗strong/strong或b/b倾斜使文本倾斜em/em或i/i删除线使文本效果增加删除线del/del或s/s下划线使文本效果增添下划线ins/ins或u/u
图像标签单标签
解释 在HTML标签中img标签用来定义在html文件中的图像。语法img src图像URL / 在书写img标签时 /可以不用加,在HTML5中去掉/也可以正确显示。属性属性含义该标签的特性
属性名属性含义及用法src图片路径img标签的必须属性。图片路径可以跟相对路径和绝对路径 img src图像URL /alt当图片无法显示时将会显示alt中的文本 img src图像URL alt .../title当鼠标悬停在图片上时将出现title属性定义的文本 img src图像URL title .../width设置图像的宽度定义宽度值的单位为像素 img srchuanhuan.png width500 heigth设置图像的高度单位为像素语法同上border设置图像边框的粗细单位为像素语法同上
图像路径/文件路径
链接标签
属性 href:用于指定跳转目标的URL地址语法格式 a href跳转目标 文本或图像 /a 点击文本或图像即可跳转到设定的跳转目标。target用来设置跳转链接的打开方式默认在本页面打开_self,在新页面打开为_blank 语法格式a href跳转目标 target目标窗口的弹出方式 文本或图像 /a#代表空链接空链接: 如果当时没有确定链接目标时 a href# 首页 /a 链接分类
四、特殊字符
