HTML与CSS的定义与初理解。

本文介绍了HTML的基本概念,强调它是一种标记语言而非编程语言,解释了HTML的简易性、可扩展性和平台无关性等特点。同时,阐述了CSS的作用,它是用于美化文档展示的层叠样式表。HTML与CSS之间的关系是内容与表现的分离,HTML负责结构,CSS负责样式。文章还提及了结构、表现和行为的概念,并讨论了开发环境搭建,推荐了Sublime和VSCode作为HTML编辑器,以及强调了浏览器兼容性测试的重要性。

前言:

        今天是学习HTML的第一天,在此之前我也有接触HTML,甚至做过一些简单的前端项目,但是今天对HTML定义的重新学习,刷新了我对HTML的认识。

想要学好HTML,那么就要搞清楚什么是HTML。接下来分享一下学习笔记。

1、什么是HTML?

        HTML不是一种编程语言,可能很多小伙伴都误以为HTML是一直编程语言,与C语言,JAVA语言和Python语言同视为编程语言。HTML是一种标记语言,用于告诉浏览器如何构造你的页面。它可以由一系列HTML元素组合成web开发人员想要的简单或者复杂的页面。

        HTML也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件,通过在文本文件中添加标记符,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容,对书写出错的标记将不指出其错误,且不停止其解释执行过程,编制者只能通过显示效果来分析出错原因和出错部位。可以使用.html与.htm作为HTML文件的后缀名(扩展名) 。

2、HTML的特点

超文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入,这也是万维网(WWW)盛行的原因之一,其主要特点如下:

        1.简易性:超文本标记语言版本升级采用超集方式,从而更加灵活方便。

        2.可扩展性:超文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超文本标记语言采取子类元素的方式,为系统扩展带来保证。

        3.平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超文本标记语言可以使用在广泛的平台上,这也是万维网(WWW)盛行的另一个原因。

        4.通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。

3、什么是CSS?

        CSS 的全称是Cascading Style Sheets ,也就是层叠样式表。

        CSS是一个用于修饰文档(可以是标记语言HTML,也可以是XML或者SVN)的语言,可以将文档以更优雅的形式呈现给用户。

4、HTML和CSS之间的关系?

  1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。

  2. CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

    HTML就像是一个人,而CSS就像是衣服和化妆品,用来装饰HTML

5、什么是结构,表现,行为?

结构(可以比喻为一个人的素颜)

HTML用于描述页面的结构

表现 (可以比喻为一个人化妆了)

CSS用于控制页面中元素的样式

行为(可以比喻为一个人的面部表情)

JavaScript用于响应用户操作

6、初识HTML

6.1、开发环境搭建

可用于编写HTML的编译工具有很多

  • 记事本:特点:无代码提示、无代码高亮显示、用户界面不友好;

  • Sublime(推荐):特点:运行速度快、代码提示、高亮显示、插件拓展、html 插件emmet、sublime text3 安装emmet插件;

  • VSCode(推荐):特点:丰富的插件支持、可进行git管理;

  • Idea:特点:集成开发工具、类似DW,node,npm...运行速度较慢;

Html是在浏览器上解析执行的,每种浏览器对相同的Html代码解析可能产生不同的结果,所以我们需要安装多种主流的浏览器进行兼容性测试;

主流浏览器:Google Chrome(谷歌)、Firefox(火狐)、Opera、Safari、Microsoft Edge。

VSCode插件推荐

HTML CSS Support - Html提示Css自动补全

HTML Preview - 提供预览HTML文档的功能

HTML Snippets - 完整的HTML标签,包括HTML5片段

Live Server - 启动一个开发本地服务器,为静态和动态页面提供实时重载功能

open in browser - 可以在默认浏览器或应用程序中打开当前文件。

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值