当前位置: 首页 > news >正文

3、Web前端学习规划:CSS - 学习规划系列文章

       CSS作为Web前端开发的第2种重要的语言,笔者建议在学了HTML之后进行。CSS主要是对于HTML做一个渲染,其也带了一些语言语法函数,功能也非常强大。

  1、 简介;

  CSS(层叠样式表)是一种用于描述网页样式的语言。它可以控制网页中的字体、颜色、布局、背景等方面的样式。CSS可以与HTML和JavaScript一起使用,使网页更加美观和易于阅读。CSS还有许多高级功能,如响应式设计、动画效果、网格布局等。它是Web开发中不可或缺的一部分,可以帮助开发人员创建出更加美观和功能强大的网页。

  2、 语法;

  CSS的基本语法包括选择器、属性和值。选择器用于选择要应用样式的HTML元素,属性用于指定要更改的样式,值用于指定属性的具体设置。例如,以下代码将更改所有段落的颜色为红色:

  p { color: red; }

  CSS还支持层叠和继承。层叠是指多个样式规则应用于同一元素时,它们将按照特定的优先级顺序进行组合。继承是指子元素可以继承其父元素的某些样式属性。

  3、 框架;

  l  CSS框架是一种用于快速构建网站和应用程序的工具,它提供了一系列预定义的样式和组件,使开发者可以更快速、更高效地创建网站和应用程序。以下是一个常用的CSS框架介绍:

  l  Bootstrap:Bootstrap是一个流行的CSS框架,由Twitter开发。它提供了一系列响应式网格系统、UI组件和JavaScript插件,使开发者可以快速构建现代化的网站和应用程序。Bootstrap还提供了大量的文档和示例,使开发者可以更容易地学习和使用它。

  l  Foundation:Foundation是另一个流行的CSS框架,由ZURB开发。它提供了一系列响应式网格系统、UI组件和JavaScript插件,使开发者可以快速构建现代化的网站和应用程序。Foundation还提供了大量的文档和示例,使开发者可以更容易地学习和使用它。

  l  Semantic UI:Semantic UI是一个基于语义化的CSS框架,它提供了一系列响应式网格系统、UI组件和JavaScript插件,使开发者可以快速构建现代化的网站和应用程序。

  4、 使用的工具;

  CSS的开发工具,目前仍然以前端开发工具VS Code为主,里面提供了CSS的提示和开发的提醒。其它的工具也有,但是目前笔者推荐的还是这个,具体的工具在其它的博文中等笔者总结后再另写。

  5、 网站;

  学习CSS的网站有不少,下面列举一些:

       runoob.com

       http://www.w3cschool.cc/

       笔者认为这些网站学习一些基本的语法等,然后再下载笔者共享的电子书籍去学习记忆即可。

  6、 学习建议;

  l  先学习CSS基础知识,包括CSS语法、选择器、盒模型、布局等基本概念。

  l  掌握CSS常用属性,如颜色、字体、背景、边框、定位等。

  l  学习CSS动画和过渡效果,包括CSS3动画、过渡、变形等。

  l  学习CSS预处理器,如Sass、Less等,提高CSS编写效率。

  l  学习CSS框架,如Bootstrap、Foundation等,快速搭建网站。

  l  学习响应式设计,掌握媒体查询、弹性布局等技术,使网站适应不同设备。

  l  学习CSS模块化,如BEM、SMACSS等,提高代码可维护性。

  l  学习CSS优化,如压缩、合并、缓存等技术,提高网站性能。

  7、 总结;

  CSS的学习,笔者认为先去网址学习基本的语法,然后再进行学习一些案例进行。后面根据项目需要进行总结和复用代码即可。

  下面提供笔者的一个博文,对于学习者提供的电子书籍能够查看,能够更快的学到该知识:https://www.cnblogs.com/lzhdim/p/4604031.html

相关文章:

3、Web前端学习规划:CSS - 学习规划系列文章

CSS作为Web前端开发的第2种重要的语言,笔者建议在学了HTML之后进行。CSS主要是对于HTML做一个渲染,其也带了一些语言语法函数,功能也非常强大。 1、 简介; CSS(层叠样式表)是一种用于描述网页样式的语言。它可以控制网页中的字体、…...

城市轨道交通列车时刻表优化问题【最优题解】

文章目录城市轨道交通列车时刻表优化问题思路文章底部城市轨道交通列车时刻表优化问题 最新进度在文章最下方卡片,加入获取思路数据代码论文:2023十三届MathorCup交流 (第一时间在CSDN分享,文章底部) 题目为数据分析类题目。列车时刻表优化…...

常年不卷,按时下班,工作能力强,同事求助知无不言,不扯皮,不拉帮结派,这样的职场清流竟然被裁掉了!...

在职场上,你永远想不到什么样的员工会被优化,比如下面这位:常年不卷,按时下班,工作很专业,同事问什么都回答,不扯皮,不拉帮结派,简直是职场清流。在上个月竟然被优化了&a…...

基于改进多目标灰狼优化算法的考虑V2G技术的风、光、荷、储微网多目标日前优化调度研究(Matlab代码实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…...

Python 函数、文件与模块

“探索 Python” 这一系列的前几篇文章已为 Python 编程新手介绍了几方面的主题,包括变量、容器对象和复合语句。本文以这些概念为基础,构造一个完整的 Python 程序。引入了 Python 函数和模块,并展示了构建一个 Python 程序、将其存储在文件…...

在Spring Boot微服务使用RedisTemplate操作Redis

记录:400 场景:在Spring Boot微服务使用RedisTemplate操作Redis缓存和队列。 使用ValueOperations操作Redis String字符串;使用ListOperations操作Redis List列表,使用HashOperations操作Redis Hash哈希散列,使用SetO…...

4月软件测试面试太难,吃透这份软件测试面试笔记后,成功跳槽涨薪30K

4 月开始,生活工作渐渐步入正轨,但金三银四却没有往年顺利。昨天跟一位高级架构师的前辈聊天时,聊到今年的面试。有两个感受,一个是今年面邀的次数比往年要低不少,再一个就是很多面试者准备明显不足。不少候选人能力其…...

人人拥有ChatGPT的时代来临了,这次微软很大方!

技术迭代的在一段时间内是均匀发展甚至止步不前的,但在某段时间内会指数级别的爆发。 ChatGPT背后的GPT 3.5训练据说花了几百万美金外加几个月的时间,参数大概有1700多亿。 这对于绝大多数的个人或企业来说绝对是太过昂贵的。 然而,微软&am…...

【C++11】自动类型推导(Type Inference)

C11 中的自动类型推导是通过 auto 关键字实现的。auto 关键字可以用于声明变量,让编译器自动推导变量的类型。具体来说,编译器会根据变量的初始化表达式来推导变量的类型。 例如,下面的代码中,变量 x 的类型会被推导为 int 类型&…...

拐点!智能座舱破局2023

“这是我们看到的整个座舱域控渗透率,2022年是8.28%,主力的搭载车型仍然是30-35万区间。”3月29日,2023年度(第五届)高工智能汽车市场峰会上,高工智能汽车研究院首发《2022-2025年中国智能汽车产业链市场数…...

SAP开发环境ABAP的搭建(客户端和服务器),Developer Key和AccessKey的绕过方法

目录 一.前言 二.客户端GUI安装 1.下载好SAP GUI 750 2.解压后找到SAPGUISetup.exe 3.安装 4.安装完整教程 三.服务端搭建 1.安装VmWare虚拟机 2.下载虚拟机镜像 3.打开虚拟机 4.调整内存大小 5.启动虚拟机 四.创建程序 1.创建包 2.创建程序 3.Developer Key和A…...

VSCode的C/C++编译调试环境搭建(亲测有效)

文章目录前言1.安装VSCode和mingw642.配置环境变量3.配置VSCode的运行环境3.1设置CodeRunner3.2设置C/C4.调试环境配置前言 这片博客挺早前就写好了,一直忘记发了,写这篇博客之前自己配的时候也试过很多博客,但无一例外,都各种js…...

物理世界的互动之旅:Matter.js入门指南

theme: smartblue 本文简介 戴尬猴,我是德育处主任 欢迎来到《物理世界的互动之旅:Matter.js入门指南》。 本文将带您探索 Matter.js,一个强大而易于使用的 JavaScript 物理引擎库。 我将介绍 Matter.js 的基本概念,包括引擎、世界…...

在线文章生成器-文章生成器在线生成

免费自动写作软件 目前市面上存在一些免费自动写作软件,以下介绍几个开源的自动写作软件。 GPT-2:这是由OpenAI推出的一款自动写作工具,它可以生成高质量的文章,其优点在于能够理解语言结构和语法规则,从而生成表达自…...

第十四届蓝桥杯大赛软件赛省赛-试题 B---01 串的熵 解题思路+完整代码

欢迎访问个人网站来查看此文章:http://www.ghost-him.com/posts/db23c395/ 问题描述 对于一个长度为 n 的 01 串 Sx1x2x3...xnS x_{1} x_{2} x_{3} ... x_{n}Sx1​x2​x3​...xn​,香农信息熵的定义为 H(S)−∑1np(xi)log2(p(xi))H(S ) − {\textstyl…...

【Leetcode】消失的数字 [C语言实现]

👻内容专栏:《Leetcode刷题专栏》 🐨本文概括: 面试17.04.消失的数字 🐼本文作者:花 碟 🐸发布时间:2023.4.10 目录 思想1:先排序再查找 思想2:异或运算 代…...

SpringBoot接口 - 如何实现接口限流之单实例

在以SpringBoot开发Restful接口时,当流量超过服务极限能力时,系统可能会出现卡死、崩溃的情况,所以就有了降级和限流。在接口层如何做限流呢? 本文主要回顾限流的知识点,并实践单实例限流的一种思路。 SpringBoot接口 …...

【花雕学AI】深度挖掘ChatGPT角色扮演的一个案例—CHARACTER play : 莎士比亚

CHARACTER play : 莎士比亚 : 52岁,男性,剧作家,诗人,喜欢文学,戏剧,爱情 : 1、问他为什么写《罗密欧与朱丽叶》 AI: 你好,我是莎士比亚,一位英国的剧作家和诗人。我很高兴你对我的…...

腾讯云物联网开发平台 LoRaWAN 透传接入 更新版

前言 之前有一篇文章介绍LoRaWAN透传数据,不过还是用物模型云端数据解析脚本,不是真正的透传。腾讯云物联网开发平台也支持对LoRaWAN原始数据的透传、转发。今天来介绍下。腾讯云 IoT Explorer 是腾讯云主推的一站式物联网开发平台,IoT 小能手…...

4.6--计算机网络之TCP篇之TCP的基本认识--(复习+深入)---好好沉淀,加油呀

1.TCP 头格式有哪些? 序列号: 在建立连接时由计算机生成的随机数作为其初始值,通过 SYN 包传给接收端主机,每发送一次数据,就「累加」一次该「数据字节数」的大小。 用来解决网络包乱序问题。 确认应答号: …...

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源: http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作,无需更改相机配置。但是,一…...

DAY 47

三、通道注意力 3.1 通道注意力的定义 # 新增:通道注意力模块(SE模块) class ChannelAttention(nn.Module):"""通道注意力模块(Squeeze-and-Excitation)"""def __init__(self, in_channels, reduction_rat…...

将对透视变换后的图像使用Otsu进行阈值化,来分离黑色和白色像素。这句话中的Otsu是什么意思?

Otsu 是一种自动阈值化方法,用于将图像分割为前景和背景。它通过最小化图像的类内方差或等价地最大化类间方差来选择最佳阈值。这种方法特别适用于图像的二值化处理,能够自动确定一个阈值,将图像中的像素分为黑色和白色两类。 Otsu 方法的原…...

Python如何给视频添加音频和字幕

在Python中,给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加,包括必要的代码示例和详细解释。 环境准备 在开始之前,需要安装以下Python库:…...

全志A40i android7.1 调试信息打印串口由uart0改为uart3

一,概述 1. 目的 将调试信息打印串口由uart0改为uart3。 2. 版本信息 Uboot版本:2014.07; Kernel版本:Linux-3.10; 二,Uboot 1. sys_config.fex改动 使能uart3(TX:PH00 RX:PH01),并让boo…...

网站指纹识别

网站指纹识别 网站的最基本组成:服务器(操作系统)、中间件(web容器)、脚本语言、数据厍 为什么要了解这些?举个例子:发现了一个文件读取漏洞,我们需要读/etc/passwd,如…...

Linux 内存管理实战精讲:核心原理与面试常考点全解析

Linux 内存管理实战精讲:核心原理与面试常考点全解析 Linux 内核内存管理是系统设计中最复杂但也最核心的模块之一。它不仅支撑着虚拟内存机制、物理内存分配、进程隔离与资源复用,还直接决定系统运行的性能与稳定性。无论你是嵌入式开发者、内核调试工…...

C++:多态机制详解

目录 一. 多态的概念 1.静态多态(编译时多态) 二.动态多态的定义及实现 1.多态的构成条件 2.虚函数 3.虚函数的重写/覆盖 4.虚函数重写的一些其他问题 1).协变 2).析构函数的重写 5.override 和 final关键字 1&#…...

计算机基础知识解析:从应用到架构的全面拆解

目录 前言 1、 计算机的应用领域:无处不在的数字助手 2、 计算机的进化史:从算盘到量子计算 3、计算机的分类:不止 “台式机和笔记本” 4、计算机的组件:硬件与软件的协同 4.1 硬件:五大核心部件 4.2 软件&#…...

[ACTF2020 新生赛]Include 1(php://filter伪协议)

题目 做法 启动靶机,点进去 点进去 查看URL,有 ?fileflag.php说明存在文件包含,原理是php://filter 协议 当它与包含函数结合时,php://filter流会被当作php文件执行。 用php://filter加编码,能让PHP把文件内容…...