优先级 继承性css特性

css实现一个太极案例

搭建一个太极的盒子 <body> <div></div> </body> 样式(使用 linear-gradient线性渐变;radial-gradient径向渐变) <style> body { background-color: lightcyan; } div { width: 200px; ......
案例 css

css实现三角形

界面搭建<i></i> 1、右三角形 i { width: 0; height: 0; border: 20px solid transparent; border-left: 20px solid red; } 实现效果: 2、下三角形 i { width: 0; height: 0; borde ......
三角形 css

使用css实现图片轮播功能

功能实现: 先搭建一个用于轮播的容器,水平置入需要轮播的图片,设置图片大小为容器的大小,超出容器的部分隐藏显示 然后用动画使每次需要轮播时让图片向左平移容器的宽度,这样一个简单的轮播就做好了 废话不多说,世界上案例吧 界面搭建 <body> <div class="swiper-container" ......
功能 图片 css

css中关于超出显示省略号

1、单行超出显示省略号 overflow: hidden; //超出隐藏 text-overflow: ellipsis; //文本超出时显示省略号 white-space: nowrap; //设置文本不换行 2、多行超出显示省略号 overflow: hidden; //超出隐藏 text-ov ......
省略号 css

css笔记

水平布局 这段时间编写静态页面,学习了几种水平布局,其中有不小的差异和注意事项,特此记录汇总一下。 1. display: inline-block 将元素修改为行内块元素,可以在不脱离文档流的情况下实现水平布局,且兼容性极佳。 但是存在元素上下、左右边距不贴合的问题,解决方法如下: 设置父元素fo ......
笔记 css

CSS 媒体查询 @media【详解】

关于媒体查询的一篇好文推荐 https://blog.csdn.net/weixin_41192489/article/details/126028971 ......
媒体 media CSS

为工作排好优先级

工作,是干不完的,因此我们需要分清轻重缓急,为它们划分优先级,这样才不至于让自己手忙脚乱。 给手头的事情排上正确的优先级,是一项很重要的工作能力。 ......
优先级

一统天下 flutter - dart: 类(抽象类,接口,继承,混入,扩展方法)

一统天下 flutter https://github.com/webabcd/flutter_demo 作者 webabcd 一统天下 flutter - dart: 类(抽象类,接口,继承,混入,扩展方法) 示例如下: lib\dart\class2.dart /* * dart 类(抽象类,接 ......
一统天下 接口 flutter 方法 天下

CSS flex布局-解决最后一行元素对齐问题

justify-content对齐问题 在CSS flex布局中,justify-content属性可以控制列表的水平对齐方式,例如space-between值可以实现两端对齐。 但是,如果最后一行的列表的个数不满,则就会出现最后一行没有完全垂直对齐的问题 .container { display: ......
布局 一行 元素 问题 flex

CSS盒子模型(Box Model)

CSS盒子模型(Box Model) 概念 所有HTML元素可以看作盒子,在CSS中,"box model"这一术语是用来设计和布局时使用 CSS盒子模型本质上是一个盒子,封装周围的HTML元素,它包括: 外边距(margin),边框(border),内边距(padding),和实际内容(conte ......
盒子 模型 Model CSS Box

25.封装、继承、多态

封装、继承、多态 一、封装 1.高内聚,低耦合 高内聚就是类的内部数据操作细节自己完成,不允许外部干涉。 低耦合就是仅暴露少量的方法给外部使用。 2.数据的隐藏 通常,应禁止直接访问一个对象中数据的实际表示,而应通过操作接口来访问,这称为信息隐藏。 3.属性私有 get/set 4.优势 提高程序的 ......
25

CSS01.认识css

1.什么是CSS? CSS是用于页面展示的语言 CSS决定了页面长什么样子 2.开发者工具 vscode快捷操作 1、快速复制一行 ctrl+c 然后 ctrl+v 2、选定多个相同的单词 双击选定一个单词然后ctrl+d 3、添加多个光标 ctrl+Alt+上箭头(下箭头) 4、全局替换某写单词 ......
CSS css 01

CSS02.css构成

为网页添加样式 术语解释 h1 { color:red; background-color: lightblue; text-align: center;} CSS规则 = 选择器(“{”前面的)+ 声明块 声明块 出现在大括号中({}) 声明块中包含很多声明(属性),每一个声明(属性)表达了某一方 ......
CSS css 02

纯 CSS 实现瀑布流式排版

最近写了个页面,想到了用瀑布流实现页面布局。在我看来一个合格的横向瀑布流式布局包含以下几个条件: 1、每个内容块高度可以不等,但宽度相等。 由于内容的不确定性,内容块的高度应根据内容高度伸缩。高度相等的话就变成了网格布局,规整倒是规整,不仅没有瀑布效果,内容的个性也无从体现。 2、内容块应进行横向排 ......
瀑布 CSS

普通css实现table表格过长数据隐藏,鼠标停留显示全部

在<style></style>中添加下面代码 table { table-layout: fixed; /* 只有定义了表格的布局算法为fixed,下面td的定义才能起作用。 */ } table td { position: relative; /*width: 80px;*/ height: ......
表格 鼠标 数据 table css

一起学学Vue Router 4.X开发中用到的新特性

前言: vue3发布这么久以来,还没好好梳理过它相关的全家桶,今天我们先聊聊Vue Router 4.X的使用以及新特性! 可以说路由是一个简单又复杂的东西,简单指的是我们日常使用的过程中只是不断的调用它的API,复杂则是我们有的需求场景需要结合路由原理去处理数据等问题,此时我们就不得不对其原理有很 ......
中用 特性 Router Vue

封装和继承

1、什么是封装 将类的某些信息隐藏在类内部,不允许外部程序直接访问,而是通过该类提供的方法来实现对隐藏信息的操作和访问 封装的步骤: 1)修改属性的可见性 改为private(防止错误修改属性值) 2)创建公有的(public)getter和setter方法 方便对私有的属性进行赋值和读取 3)在g ......

CSS实现跑马灯效果

盒子区域 创建一个大盒子,用来装我们的广告语,还有跑马灯的四个小盒子 <div class="box"> <div></div> <div></div> <div></div> <div></div> 创意广告 </div> 设置box样式 * { padding: 0; margin: 0; } ......
跑马灯 效果 CSS

继承

继承:把这几个子类重复的成员单独拿出来封装成一个类,作为它们几个共同的父类 using System; namespace 继承 { class Program { static void Main(string[] args) { Student stu = new Student(); } pu ......

继承基本概念

是一种代码复用机制,通过继承,一个类(称为派生类或子类)可以继承另一个类(称为基类或父类)的属性和行为。子类继承父类的成员变量、成员函数、构造函数和析构函数等,并且可以在此基础上增加或修改自己的成员变量和成员函数,以实现特定的功能需求。 继承可以分为单继承和多继承。单继承是指一个派生类只能继承一个基 ......
概念

css实现霓虹灯特效字体

在开始之前先了解外部字体的引入: vite中字体的引入方法(.otf字体等)如下: 1、在src下的assets文件夹下创建font文件夹,将下载好的字体包放到该文件夹下 2、在font文件夹下创建font.css文件,如果你用的是scss,那么就是font.scss。less同理。 3、在font ......
霓虹灯 霓虹 特效 字体 css

SQLAlchemy 2.0 新特性

orm-declarative-models Migrating an Existing Mapping Step one - declarative_base() is superseded by DeclarativeBase Step two - replace Declarative use ......
SQLAlchemy 特性 2.0

JS中对象继承方式

JS中对象继承方式 JS对象继承方式 摘自《JavaScript的对象继承方式,有几种写法》,作者:peakedness链接:https://my.oschina.net/u/3970421/blog/2872629 方式一:对象冒充 原理:构造函数使用this关键字给所有属性和方法赋值(即采用类声 ......
对象 方式

CSS 组合选择符

CSS 组合选择符 组合选择符说明了两个选择器之间的关系。 CSS组合选择符包括各种简单选择符的组合方式。 在 CSS3 中包含了四种组合方式: 后代选择器(以空格 分隔) 子元素选择器(以大于 > 号分隔) 相邻兄弟选择器(以加号 + 分隔) 普通兄弟选择器(以波浪号 ~ 分隔) 后代选择器 后代 ......
CSS

CSS必知必会

CSS概念 css的使用是让网页具有统一美观的页面,css层叠样式表,简称样式表,文件后缀名.css css的规则由两部分构成:选择器以及一条或者多条声明 选择器:通常是需要改变的HTML元素 声明:由一个属性和一个值组成,每个属性有一个值,属性和值使用类似key:value的形式(如下方h1就是选 ......
CSS

了解CSS Module作用域隔离原理

CSS Module出现的背景 我们知道,Javascript发展到现在出现了众多模块化规范,比如AMD、CMD、 Common JS、ESModule等,这些模块化规范能够让我们的JS实现作用域隔离。但CSS却并没有这么幸运,发展到现在却一直没有模块化规范,由于CSS是 根据选择器去全局匹配元素的 ......
原理 作用 Module CSS

CSS 高阶小技巧 - 角向渐变的妙用!

本文将介绍一个角向渐变的一个非常有意思的小技巧! 我们尝试使用 CSS 绘制如下图形: 在之前,类似的图案,其实我们有尝试过,在 单标签实现复杂的棋盘布局 一文中,我们用单标签实现了这样一个棋盘布局: 那么,本文有什么特殊之处呢?让我们一探究竟。 快速实现网格布局 首先,上述的布局还是希望使用一个标 ......
高阶 妙用 技巧 CSS

【django-vue】封装logger 封装全局异常 封装response 数据库配置 用户表继承AbstractUser配置

上节回顾 这是一个django-Vue前后端分离的项目(视频网站) # 1 企业软件类型 -商城类 -公司内部: -业务 -RBAC权限管理 # 2 软件开发流程 -你的工作流程 # 3 pip换源 :国内镜像 -命令行中 -pycharm中 # 4 虚拟环境: -每个项目有自己的环境 -虚拟环境: ......

CSS 数学函数与容器查询实现不定宽文本溢出跑马灯效果

在许久之前,曾经写过这样一篇文章 -- 不定宽溢出文本适配滚动。我们实现了这样一种效果: 文本内容不超过容器宽度,正常展示 文本内容超过容器的情况,内容可以进行跑马灯来回滚动展示 像是这样: 但是,之前的方案,有一个很明显的缺点,如果我们事先知道了容器的宽度,那么没问题,但是如果没法确定容器的宽度, ......
跑马灯 容器 函数 文本 效果