什么是 HTML?

什么是 HTML?

超文本标记语言或 HTML 是用于创建网页的常用标记语言。使用 HTML 组件(例如标签和属性)可以开发和构建部分、段落和链接。

HTML有很多用例,即:

· Web开发- 开发人员使用 HTML 代码来设计浏览器如何显示网页元素,例如文本、超链接和媒体文件。

· 互联网导航- 由于 HTML 被大量用于嵌入超链接,因此用户可以轻松地在相关页面和网站之间导航和插入链接。

· 网络文档- HTML 使组织和格式化文档成为可能,类似于 Microsoft Word。

所有 HTML 页面都包含许多 HTML 元素,这些元素由许多标签和属性组成。网页的基础是由 HTML 元素组成的。与描述元素属性的属性相比,标签向 Web 浏览器指定元素开始和结束的位置。

一个元素由三个主要组件组成:

· 打开标签 — 它们指示元素变为活动的点。打开和关闭的尖括号包裹在标签周围。例如,要创建一个段落,请使用开始标签 (p)。

· 内容 - 其他用户看到的输出称为内容

· 结束标签- 结束标记与开始标记相同,但它在元素名称之前加上一个正斜杠。例如,要结束一个段落,请使用</p.>

这是我们的基本 HTML 标签列表:

  • ** <b>** 制作粗体文本
  • ** <a>** 链接
  • ** <strong>** 用于强调的粗体文本
  • ** <body>** 主要的 HTML 部分
  • ** <br>** 休息
  • ** <div>** 它是 HTML 文档的一个部分或一部分
  • ** <h1>至<h6>** 到标题
  • ** <i>** 制作斜体文本
  • ** <img>** 对于文档中的图像
  • ** <ol>** 是一个有序列表, <ul> 对于无序列表
  • ** <li>** 是项目符号(有序列表)中的列表项
  • ** <p>** 对于段落
  • ** <span>** 为部分文本设置样式。

什么是 CSS?

简而言之,CSS 是一种描述网站样式的语言。 CSS代表 层叠样式表 .我们使用这种语言来确定我们网站元素的显示方式。

如何使用 CSS

我们知道如何将 CSS 与 HTML 结合使用的三种方式,即内部、外部,当然还有内部。

1.内部

要直接在 HTML 文档中使用样式表,我们必须在 HTML 文件的开头使用 style 标签定义样式。看看下面的例子:

通常,当您创建一个没有太多样式的简单单页网站时,这是最佳实践。

2. 外部

在这种情况下,您将创建一个单独的 CSS 文件。这是最常见的用途,因为它允许您在整个网站上使用相同的 CSS 文件。此外,它还可以帮助您 **** 轻松更改和监控整个网站的样式。在 HTML 文件中,您必须与头部的 CSS 文件建立连接(查看下面的示例)

3.内联

内联样式有利于对单个准确的 HTML 元素进行小幅更改。 CSS 代码直接写入 HTML 标记并仅适用于该部分。请参见下面的示例:

这就是内联使用 CSS 时的样子。

什么是 CSS 属性和属性值?

描述什么是 CSS 属性和属性值的最佳方式是举例。所以下面有一段代码,它将选择我们 HTML 文档中的所有段落并将字体大小设置为 20 像素。

如您所见,在我们的案例 p(段落)中,代码以选择器开头。现在,让我们专注于声明。

声明由属性和属性值组成。在我们的例子中,属性是为 HTML 元素赋予样式的不同方式,所有段落的字体大小 (p)。

因此,属性值也是如此。这些值总是写在冒号之后,让您有可能多次出现某个属性;在我们的例子中,它是 20 像素。

CSS 选择器

当我们谈论什么是 CSS 时,我们必须看看不同类型的选择器。选择器帮助我们定义或选择网站的任何部分或我们想要设置样式的任何元素 .

以下是我认为最常见的类型的列表。

1. HTML元素

在前面的示例中,我们使用了基于 HTML 元素的选择器。元素选择器也称为标签或类型选择器,用于根据 HTML 元素或标签对网站的一部分进行样式设置。例如 h2 选择所有带有 a 的元素

标签。

2. ID选择器

使用 ID 选择器时,我们根据 ID 属性中的名称选择网站上的所有元素。这在开发一个简单的网站时非常方便,因为可以在 CSS 和 JavaScript 中使用相同的 ID 名称。在 CSS 中,在编写 ID 名称之前,必须使用破折号 (#)。例如 #nav 将选择所有包含 id=”nav” 的元素

或者

.

**#导航** {  
    **颜色** : 红色的 ;  
    **字体** -重量: 大胆的 ;  
 }

3.类选择器

使用此选择器,我们为其赋予某些属性,然后将这些属性分配给我们网站上的不同元素。此外,在使用类选择器时,我们可以将一个类分配给多个元素。当您开始进行 Web 开发时,重要的是您知道在 CSS 文件中您必须在类名之前使用点,并且在 HTML 或 JS 文件中使用该类时不要使用点。请看下面的类头部分示例:

 . **标题部分** {  
    **颜色** : 红色的 ;  
    **字体** -重量: 大胆的 ;  
 }

伪类如 :hoover 或: active

众所周知,网站上的某些元素可以有不同的状态,每个状态可以有不同的样式。这就是伪类的用武之地;我们使用它们为处于不同状态的元素分配属性。例如,当我们将鼠标悬停在链接上时,链接的样式会发生变化。看看下面的例子:

**一:悬停** **{  
 颜色:** **** 浅蓝 **;  
 }**

媒体查询

自从引入移动设备以来,这是最需要的 CSS 功能。事实上,当我们谈论响应式网页设计时,我们谈论的是媒体查询。简而言之,这引入了@media 规则,它在特定条件下将属性分配给元素。例如,如果浏览器屏幕尺寸小于 700 px,字体大小应该改变:

**@媒体** 只要 **屏幕** 和 ( **最大宽度** : 700 像素) {  
 **身体** {  
  **字体大小** :80像素;  
 }  
 }

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明

本文链接:https://www.qanswer.top/1848/58583017

posted @ 2022-08-30 18:00  哈哈哈来了啊啊啊  阅读(727)  评论(0编辑  收藏  举报