Web 开发严重依赖三种主要语言,即 HTML、CSS 和 Javascript。 HTML 描述了网站的结构,即网页上有哪些元素。
另一方面,层叠样式表 (CSS) 描述了 HTML 元素如何直观地呈现,而 Javascript 用于向网页添加交互性和动态行为。
在创建美观的用户界面和出色的用户体验时,CSS 尤为重要。 CSS 负责网页内容的呈现和样式设置,用于控制网页的布局、外观和样式。
例如,使用 CSS,您可以更改内容在网页上的显示方式,并修改字体、颜色、边框、边距、间距和背景等内容。
此外,CSS 对于创建适应不同屏幕尺寸和设备的响应式网站至关重要。 它还允许在网站上的不同页面上保持一致和统一的样式,并有助于使残障用户可以访问网站。
如果您想让您的网站与您的品牌保持一致,并在网站中很好地使用您的品牌颜色,CSS 可以帮助您做到这一点。
如果没有 CSS,网站可能看起来非常相似,设计非常平淡,没有样式、颜色、悬停效果或背景。 网站也不会响应迅速,并且几乎没有定制功能来使网站与品牌保持一致。
因此,CSS对于Web开发人员来说是一个非常重要的工具。 要在您的网站上使用 CSS,您需要将其与页面的 HTML 链接。 请记住,HTML 描述了网站的元素和内容。
因此,您需要将 HTML 与 CSS 链接起来,以便使用 CSS 来设置网站元素和内容的样式。 本文将教您如何执行此操作。 不过,在了解如何将 CSS 链接到 HTML 之前,让我们先了解一下编写 CSS 并使用它来设置 HTML 元素样式的不同方法。
在 HTML 中包含 CSS 的不同方法
在 HTML 文件中包含 CSS 的主要方法有3种。 这包括:
#1. 内联样式
这涉及直接在每个 HTML 元素上编写 CSS 样式,如下所示:
<body style="background-color: yellow;"> <h1 style="color: orangered; font-size: 40px;">techblik.com</h1> <p style="color: blue; font-size: 16px;">techblik.com is an online publication that produces high-quality articles on Technology, Business, and Fintech to help businesses and people grow.</p> </body>
尽管此方法允许您轻松地将 CSS 添加到 HTML 页面,但这并不是将 CSS 添加到 HTML 的好方法。 这是因为它非常耗时,使代码难以阅读和维护,特别是对于大规模样式,并且会影响网页的加载时间。
#2. 内部CSS
这涉及到在 HTML 页面的
部分中的