网络安全之前端学习(css篇1)

那么经过之前的学习,我们对HTML有了基础的认识,接下来讲一讲css。

  1. 认识css

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

CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

在创建css时,文件后缀名为.css。使用css可以使网页更加美观。

2.Css 属性

注:css主要是使用style标签,但是在head部分使用而不是body部分,这个要注意。

2.1 css常见属性(以下内容摘自https://juejin.cn/post/7449408525581402163)

1.color: 设置文本的颜色。

2.font-size: 设置字体的大小。

3.text-align: 设置文本的对齐方式。

4.font-family: 设置字体系列。

5.line-height: 设置行高。

6.background-color: 设置背景颜色。

7.background-image: 设置背景图像。

8.background-size: 设置背景图像的大小。

9.border: 设置边框的宽度、样式和颜色。

10.border-width: 设置边框的宽度。

11.border-color: 设置边框的颜色。

12.border-style: 设置边框的样式。

3.使用css

3.1引入css

引入css的方式有三种,分别为内联样式,内部样式,外部样式。本文将详细讲解这三种样式,都依托于style关键字。

3.1.1内联样式

内联样式其实和之前的属性差不多,就是在标签中加style

3.1.2内部样式

内部样式使用的比较多,就是在head标签内使用style标签,在style标签中对所要更改样式的标签进行更改

3.1.3外部样式

外部样式就是使用外部的css文件对本html文件的标签进行更改。这个不需要使用style关键字,但是要使用link标签。而在.css文件中则对标签进行修改。

<link rel="stylesheet" href="">

其中href内要输入你的文件路径。

外部样式使用的比较多,可以多次引用,同时将样式代码和 HTML 结构分开,有助于提升代码的可读性和可维护性。适合大规模的项目。

4.结语

那么这一节先到这里结束了,那么下一节主要讲讲css选择器,希望大家上手实验,我们下期再见。

相关推荐
面朝大海,春不暖,花不开3 分钟前
Spring Boot MVC自动配置与Web应用开发详解
前端·spring boot·mvc
知否技术3 分钟前
2025微信小程序开发实战教程(一)
前端·微信小程序
玲小珑4 分钟前
Auto.js 入门指南(五)实战项目——自动脚本
android·前端
Sparkxuan4 分钟前
IntersectionObserver的用法
前端
玲小珑5 分钟前
Auto.js 入门指南(四)Auto.js 基础概念
android·前端
全栈技术负责人5 分钟前
Webpack性能优化:构建速度与体积优化策略
前端·webpack·node.js
爱吃肉的小鹿7 分钟前
浏览器渲染的核心流程及详细解析(2025.6月最新)
前端
贩卖纯净水.12 分钟前
webpack打包学习
前端·学习·webpack
敲键盘的小夜猫24 分钟前
RunnablePassthrough介绍和透传参数实战
java·服务器·前端
独立开阀者_FwtCoder32 分钟前
MySQL FULLTEXT索引解析:为什么它能大幅提升文本搜索性能?
前端·javascript·面试