优惠券 波浪 效果css
【5.0】前端基础之CSS进阶
# 【5.0】前端基础之CSS进阶 # 【一】分组与嵌套 ### 【1】分组 ```html Title 这是div标签 这是p标签 这是span标签 ``` > 上述方法，重复代码造成了代码的冗余 ```html Title 这是div标签 这是p标签 这是span标签 ``` ### 【2】嵌套 ......
【6.0】前端基础之CSS终章
# 【6.0】前端基础之CSS终章 # 【一】浮动带来的影响及解决办法 ## 【1】父标签塌陷 - 造成父标签塌陷的问题 ```html Title ``` - 内部元素因为浮动导致了外边框无法框柱内部元素 ## 【2】解决办法一 ```html Title ``` - 内部再创建一个子标签，给一个 ......
CSS|盒子模型
# CSS|盒子模型 > 因为最近实习，学的是这种玩意，老师文档写的不错，更点基础的东西。 ## 一. 盒子分类 每个元素都有默认的显示方式, 包括 - 块盒: 独占一行, 可以设置宽高 - 行盒: 不独占一行, 不能设置宽高(不生效)高度由字体大小撑开 显示方式是由display属性控制的 dis ......
CSS|常用CSS属性
## 一. 文本属性 ### 1 字体相关 #### 1) 大小font-size > 作用 设置字体大小 > 示例 ```css h1 { font-size:20px; } ``` #### 2) 字体font-family > 作用 设置字体 > 示例 ```css body { font-f ......
【效果备忘】修改网页的滚动条样式
滚动条样式的修改是通过伪元素实现的： -webkit-scrollbar 滚动条整体部分 -webkit-scrollbar-button 滚动条两端的按钮 -webkit-scrollbar-track 外层轨道 -webkit-scrollbar-track-piece 内层轨道， ......
CSS|常用CSS属性
# CSS|常用CSS属性 ## 一. 文本属性 ### 1 字体相关 #### 1) 大小font-size > 作用 设置字体大小 > 示例 ```css h1 { font-size:20px; } ``` #### 2) 字体font-family > 作用 设置字体 > 示例 ```css ......
CSS文字超出宽度---换行总结
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< ......
CSS|CSS基础
# HTML|CSS基础 ## 一. CSS简介 ### 1. 什么是CSS CSS(Cascading Style Sheets) ，通常称为CSS样式表或层叠样式表 ### 2. CSS的作用 CSS的作用就是用来规定每个HTML元素表现的样子, 比如 - 字体的大小 - 颜色 - 摆放位置.. ......
【4.0】前端基础之CSS
# 【4.0】前端基础之CSS # 【一】什么是CSS - 层级样式表： - 就是给HTML标签添加样式的，让它变得好看 # 【二】注释语法 ```css /* 这是注释 */ ``` # 【三】CSS的语法结构 ```css 选择器 { 属性1:值1; 属性2:值2; 属性3:值3; 属性4:值4 ......
【一】CSS之引入
# 【一】CSS之引入 - 层叠样式表（`Cascading Style Sheets`），与HTML一样，也是一种标记语言 - 其作用就是给HTML页面标签添加各种样式，**定义网页的显示效果**，将网页**内容和显示样式进行分离**，提高了显示功能。 - 简单一句话就是，CSS的代码可以告诉浏览 ......
【五】CSS之元素种类
# 【五】CSS中的元素种类 ## 1 、行内元素[inline]： - 特点： - 同一个行内元素，可以一行多个，直到当前一行满行就会换行到第二行显示 - 行内元素默认是没有宽度与高度的，是依靠内容来支撑的。 - 行内元素是没有完整的边距的，只存在左右边距，没有上下边距。[边距就是元素与元素或元素 ......
【七】CSS之弹性布局
# 【七】CSS之弹性布局 ## 【1】什么是弹性布局 - 随着技术的发展，那么在当前市场上，安装浏览器的客户端越来越多，设备也越来越多，所以CSS提供的布局，不仅应用于PC端，还可以应用于移动端设备 - 例如：watch、ipad，mobile等，甚至包括机器人界面、智能屏、智能电视机、3D广告屏 ......
【二】CSS基本语法之选择符
# 【二】CSS基本语法之选择符 - 作为一门标记语言，css的语法也是比较简单的，主要由三部分构成：选择符，样式属性和属性值。 - css中的语法虽然简单，但是太多内容了，所以要学会css，就需要多背多写，掌握使用规律，懂得借助浏览器与css手册。 > 注意，在前端领域中，有些人会觉得css负责外 ......
【三】CSS之样式的优先级
# 【三】CSS之样式的优先级 ## 1 css样式的优先级 - css在使用过程中，因为很多的选择符有具有批量查找的特点，所以很容易出现样式污染的问题。 - 样式污染出现的原因是因为css代码编写过程中，因为引入方式、书写先后顺序以及选择符的优先级等问题导致的。 - 注意：样式污染并非不好，而是要 ......
css第五天
优先级的介绍特性:不同选择器具有不同的优先级，优先级高的选择器样式会覆盖优先级低选择器样式优先级公式:继承<配符选择<签选择器< 类选择器<d选择<内样式important注意点:!important写在属性值的后面，分号的前面!!important不能提升继承的优先级，只要是继承优先级最低!实际开 ......
CSS（六）CSS3新特性
圆角和阴影 圆角，使用 border-radius 可以给任何元素制作圆角 阴影，box-shadow 向框添加一个或多个阴影：box-shadow: h-shadow v-shadow blur color h-shadow 水平阴影的位置 v-shadow 垂直阴影的位置 blur 模糊距离 c ......
CSS（七）字体图标
经常会用到一些图片，但是我们在使用这些图片时，往往会遇到失真的情况，而且图片数量多的话，页面加载很慢，所以我们可以使用字体图标的方式来显示图标，既解决了失真的问题，也解决了图片占用资源的问题。常用资源 [阿里字体图标库][https://www.iconfont.cn/] 优点： 轻量，加载速度快， ......
CSS（五）脱离文档流
脱离文档流 标准文档流导致： 高矮不齐，底边对齐 空白折叠现象 很多空格，都会折叠会一个空格 img标签有缝隙 脱离文档流：使一个元素脱离标准文档流有三种方式： 浮动 绝对定位 固定定位 浮动 增加浮动 增加一个浮层来放置内容。可以理解为有两层页面，一层为原页面，一层为脱离文档流的浮层页面，所以会出 ......
CSS（四）盒子模型
盒子模型box model CSS盒子模型本质上是一个盒子，封装周围的HTML元素。它包括： margin（外边距）、border（边框）、padding（内边距）、content（内容） 弹性盒子模型flex box felx box是CSS3的一种新的布局模式。是为了让页面适应不同的屏幕大小和设 ......
CSS选择器
CSS选择器，发现很多都忘记了。今天的笔记中包括44个选择器，基本涵盖了CSS 2和CSS 3的所有规定。 CSS选择器笔记 阮一峰 整理 参考网址：456 Berea Street 一、基本选择器 序号 选择器 含义 1. * 通用元素选择器，匹配任何元素 2. E 标签选择器，匹配所有使用E标签 ......
CSS学习笔记2-CSS的继承_层叠_类型和CSS盒子模型
# 1 CSS属性继承 CSS的某些属性具有继承性(Inherited): 如果一个属性具备继承性, 那么在该元素上设置后, 它的后代元素都可以继承这个属性; 当然, 如果后代元素自己有设置该属性, 那么优先使用后代元素自己的属性(不管继承过来的属性权重多高); ......
BackUpLogView 系列 - 应用效果图
主页面： 点击业务详情： 打开备份日志。 可以查看到备份文件的基本信息 根据频次或者近3天备份可视化 TRANSLATE with x English Arabic Hebrew Polish Bulgarian Hindi Portuguese Catalan Hmong Daw Romanian ......
HTML+CSS+JavaScript基础
1、HTML(Hypertext Markup Language，超文本标记语言), 用来向浏览器说明内容的结构、 2、DOM(Document Object Model, 文档对象模型)指的是HTML标签的层次结构。每一对HTML标签（有的时候是一个标签）都是一个元素。 3、CSS(Cascadi ......
2023-07-03 禁止uniapp之app端上下滑动出现的回弹效果："app-plus": {"bounce": "none"}
前言：uni项目打包到app（以Android为例）上运行，上下滑动页面的时候会出现一个半圆，这就是所谓的退弹，如需关闭可在pages.json文件中的globalStyle中添加一下代码即可： "app-plus": { "bounce": "none" } uniapp关于app-plus的更多 ......
css中transform具体使用，及场景
CSS transform 属性用于改变元素的形状、大小和位置，以及创建各种动画效果。以下是 transform 常用的一些属性及其使用场景： 1.translatetranslate 属性用于移动元素的位置。它可以接受一个或两个参数，分别表示横向和纵向的偏移量。 ```css / 在x轴上向右移动 ......
css学习(二)
## css盒子模型 ### 认识盒子模型 我们可以把HTML每一个元素看出一个个的盒子.具备如图四个属性 
### css引入 1. 内联样式 ```css 我是div元素 ``` 2.内部样式 ```css ``` 3. 外部样式 ```css /* 可以通过@import引入其他的css资源 */ @import url(./style.css); @import url(./test.css); . ......
css添加背景图片
方法一： ``` ``` 方法二： ``` style="background: url(lib/login.png); background-size: 100% 100%; background-attachment: fixed" ``` ......
2023-07-01 css之邮票锯齿
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi ......
Scss 列表逐一淡出效果
# 界面结构 ```html file:MenuList.vue/template 回到顶部 我的标签 随笔分类 文章分类 随笔归档 文章归档 我的相册 我的日历 ``` 这里通过一个布尔变量控制 class `close-menu-body` 和 `open-menu-body` 之间的切换。 这 ......