HTML与CSS的定义与初理解。
前言:
今天是学习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之间的关系?
HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
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 - 可以在默认浏览器或应用程序中打开当前文件。
HTML与CSS的定义与初理解。相关推荐
- html中行高是指字的高度嘛,CSS行高line-height的理解
一.行高的字面意思 "行高"顾名思义指一行文子的高度.具体来说是指两行文子间基线间的距离. 基线是在英文字母中用到的一个概念,我们刚学英语的时候使用到的那个英语本子每行有4条线,其 ...
- CSS中定义多个链接样式,在CSS中定义【导航栏】超链接样式
1.案例css代码 .divcss5 a:link{ color:#F00}/* 链接默认为红色 */ .divcss5 a:hover{ color:#000}/* 鼠标悬停黑色 */ .divcs ...
- Dreamweaver CSs网页设计css规则定义翻译
在Dreamweaver CS网页设计中,对于初学者来说,学习CSS样式基础其实不是很难,现在小编将CSS规则定义翻译如下,希望能给一起学习网页设计的网友更多方便,可供参考与理解. 当然,如果你觉得此 ...
- DreamWeaver CS5 CSS规则定义面板 记录
Dreamweaver 中CSS定义的面板可以实现对CSS的编辑,这里对其中几项不是很熟悉的作下笔记: 因为时间珍贵,所以很大一部分都是转自网络的内容.而且对于这些内容,别人已经整理的很好了,没有必要 ...
- css txt-aline,CSS规则定义.doc
CSS规则定义 CSS规则定义 一.类型 Font-family:字体 font-size:字体大小: xx-small 最小 x-small 较小 small 小 medium 正常(默认值) la ...
- 学习总结:CSS(一)定义方式、选择器、选择器权重
一.CSS的定义方式 1.内部样式:<style></style> 2.行间样式:<div style="width:100px;height:100px;&q ...
- 统一过程(UP)定义了初启阶段、精化阶段、构建阶段、移交阶段和产生阶段,每个阶段以达到某个里程碑时结束,其中()的里程碑是生命周期架构。 A.初启阶段 B.精化阶段 C.构建阶段 D.移交阶段
[最全!最详细解析!!!] 统一过程(UP)定义了初启阶段.精化阶段.构建阶段.移交阶段和产生阶段,每个阶段以达到某个里程碑时结束,其中()的里程碑是生命周期架构. A.初启阶段 B.精化阶段 C.构 ...
- CSS魔法堂:深入理解line-height和vertical-align
前言 一直听说line-height是指两行文本的基线间的距离,然后又说行高等于行距,最近还听说有个叫行间距的家伙,@张鑫旭还说line-height和vertical-align基情四射,贵圈真乱啊 ...
- html css 重复,CSS重复定义的问题请教_html/css_WEB-ITnose
,是不是就无效了? 回复讨论(解决方案) 外部css样式和内部css样式同时存在,以内部css样式为准. 内部css样式与标签的style属性同时存在,以style属性的样式为准. 你说的这种情况应该 ...
最新文章
- 《Python编程初学者指南》——1.6 回到Game Over程序
- lr:lr中错误解决方法19种
- luoguP2657 [SCOI2009]windy数
- 关于对象、构造函数、原型、原型链、继承
- hdu3613(扩展KMP)
- Endpoint 理解
- 计算机图形学在数学中的应用,计算机图形学的数学工具与C#实现:数学C
- CentOS安装和配置FTP
- Java 将字符串转换为字符数组 toCharArray()
- centOS7安装matlab2014a
- ajax存储单个数据_科学家现在可以使用单个原子存储数据
- 还是畅通工程1233
- 基于JAVA+Swing+MYSQL的停车场管理系统
- Xcode中的iOS工程模板
- 02-准备实验环境(批量克隆)-011-DiskPart 遇到错误 介质受写入保护
- 绝招:技术专家教你打造个性域名!
- C语言之用循环来打印各种各样的图案
- 中国科学院大学计算机考研好考吗,中国科学院大学考研难吗?一般要什么水平才可以进入?...
- C语言两种方法实现归并排序
- cannot import name ContextVar