HTML和CSS的关系

html-css017

HTML和CSS的关系,第1张

一、css是Cascading Style Sheets 的缩写,即层叠式样式表单，它是由W3C协会制定并发布的一个网页排版式标准,是对HTML语言功能的补充。

二、HTML和CSS的区别?

1、定义不同：

html是HyperTextMark-upLanguage的缩写，即超文本标记语言；

css是Cascading Style Sheets 的缩写,即层叠式样式表单，它是由W3C协会制定并发布的一个网页排版式标准,是对HTML语言功能的补充。

2、用途不同：

html则是用于文本内容，包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。

css是多用于样式，主要的用途是对网页中字体、颜色、背景、图像及其他各种元素的控制,使网页能够完全按照设计者的要求来显示。

3、CSS语法与HTML语法完全不同：

HTML里代码是功能标签，如DIV、SPAN、A链接、em标签、I斜体标签、u下划线等，html代码语法范例：<div>内容</div>

CSS样式代码语法是div{样式单词：值}

三、HTML和CSS联系：

CSS与HTML相同之处在于，两个共同作用让网页实现需要的布局样式。

扩展资料：

1、标记符<html>,说明该文件是用超文本标记语言（本标签的中文全称）来描述的,它是文件的开头而</html>,则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。

2、CSS为HTML标记语言提供了一种样式描述，定义了其中元素的显示方式。CSS在Web设计领域是一个突破。利用它可以实现修改一个小的样式更新与之相关的所有页面元素。

CSS可以将样式定义在HTML元素的style属性中，也可以将其定义在HTML文档的header部分，也可以将样式声明在一个专门的CSS文件中，以供HTML页面引用。总之，CSS样式表可以将所有的样式声明统一存放，进行统一管理。

1、HTML超文本标记语言（HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

2、CSS层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

3、HTML和CSS，都是前端技术的基础，简单来说一个是前端网页的结构、一个是前端网页的样式；HTML和CSS这两个要合在一起使用才有意义。

4、希望对你有帮助。

HTML、 CSS、 JavaScript三者的关系

网页主要由三部分组成： 结构（ Structure） 、 表现（ Presentation） 和行为（ Behavior）

HTML —— 结构， 决定网页的结构和内容（ “是什么”）

CSS —— 表现（ 样式） ， 设定网页的表现样式（ “什么样子”）

JavaScript（ JS） —— 行为， 控制网页的行为（ “做什么”）

一、 HTML语言

1.1什么是HTML语言（ HTML概述）

英文全称： Hyper Text Markup Language

中文全称： 超文本标记语言

HTML 语言是制作网页的最基本语言， 并且只能通过web浏览器显示出来。

Hyper（ 超） ：

用HTML制作的网页可以通过其中的链接从一个网页“跳转”至另一个网页。

Text（ 文本） ：

HTML是一种文本解释性的程序语言， 即它的源代码将不经过编译而直接在浏览器中运行时被“翻译”。

Markup（ 标记） ：

HTML的基本规则就是用“标记语言” ---- 成对尖括号组成的标签元素来描述网页内容是如何在浏览器中显示的。

1.2 HTML文档结构

HTML文档一般由两部分组成：

1. 文档所要表达的内容信息（ 文字、 图片等） ；

2. 一系列的HTML标签；

1.3 HTML标签

1.3.1 什么是HTML标签

1. HTML标签是用 <>所括住的指令， 主要分为：

单标签： <起始标签/>

双标签： <起始标签></结束标签>

例如：

<br/>

<div></div>

2. 通常使用的是双标签。 有一个起始标签就对应有一个结束标签。 标签内容写在起始标签和结束标签之间。

<div>标签内容</div>

3. 在元素的起始标签中， 还可以包含“属性”来设置元素的其他特性。 一个标签可以有多个属性,每个属性之间用空格隔开。

<div 属性名="属性值"></div>

例如：

<div class="wrap" id="wrap"></div>

4. 每一对双标签之间可以嵌套， 但不能交叉。

正确示例：

<div>

<p></p>

</div>

错误示例：

<div>

<p>

</div>

</p>

1.4 编码器

1.4.1 WebStorm源码主体标签含义

<!DOCTYPE>：

是一个声明不是 HTML 标签； 它是用来告诉 web 浏览器要使用哪个 HTML 版本来对页面进行编写。

<html>：

<html>是文档标识符， 它是成对出现的， 首标签<html>和尾标签</html>分别位于 HTML 文档的最前面和最后面， 明确地表示文档是以超文本标识语

言（ html)编写的。 该标签不带有任何的属性。

<head>：

<head>标签用于定义文档的头部， 它是所有头部元素的容器。 <head>中的元素可以引用脚本、 指示浏览器在哪里找到样式表、 提供元信息等等。

<meta>：

<meta>标签位于文档的头部， 用于定义文件信息， 对网页文件进行说明。 其中name属性主要用于描述网页， 与之对应的属性值为content， content中

的内容主要是便于搜索引擎机器人查找信息和分类信息用的。

<body>：

<body>标签用于定义文档的主体， 即在浏览器上看到的网页内容。