盒子 弹性css3 css
小练习：图片盖住文字，当鼠标移到盒子范围，图片消失显示文字
CSS进阶-动画： https://www.cnblogs.com/warmNest-llb/p/17870720.html 练习1：图片盖住文字，当鼠标移到盒子范围，图片消失显示文字 代码： 1 /* 小练习：图片盖住文字，当鼠标移到盒子范围，图片消失显示文字 */ 2 /* 嵌套：div-->b ......
企业级 Web 应用里使用 CSS 调整应用外观的一些例子
笔者在日常工作中曾经负责过一些企业级 Web 应用的负责和开发，也曾经指导过一些客户的二次开发人员，通过各种方式对我们发布的企业级 Web 应用进行一些定制开发。 所谓企业级前端应用，是指为大型企业或组织开发的前端应用，这些应用具有超过一般 2C 软件的技术复杂度，高度定制化和可扩展性，因为企业级前 ......
CSS进阶3-transform 动画-渐变(线性渐变、镜像渐变)-关键帧
1. 动画 介绍：改变盒子在平面内的形态（平移、缩放、旋转、倾斜） 属性： 平移：transform：translate(值1 ，值2);(默认为X轴，translateY--下移) — —平移依然在原来文档流。 移动：transform：translate(值1，值2)；可右斜移动 代码： /* ......
css选择器
这篇文章主要总结了css选择器的相关知识 1.元素选择器 <div id="container"> <p class="text"></p> <h1 class="title text"></h1> <div> // 选中p元素 p{ font-size: 12px; } 2. 群组选择器 //ht ......
关于 Web 开发中的 CSS before 伪元素
我用 Chrome 打开一个网页后，F12 打开 Chrome 开发者工具，在 Elements 面板观察到一些 DOM 元素有 ::before, 这是什么含义？ 在Web前端开发中，::before 是CSS伪元素之一，它用于在指定元素的内容前插入生成的内容。这个伪元素允许开发者通过CSS样式向 ......
css3 变量使用和修改变量
<!DOCTYPE html> <html> <head> <style> :root { --blue: #1e90ff; --white: #ffffff; --aa: 1212121; } body { background-color: var(--blue); } h2 { border- ......
CSS进阶2-弹性布局-弹性盒子
本节重点： 弹性布局（弹性盒子） BFC布局/规范 CSS新属性，不包含边框和内边距 CSS3的拓展：普通盒模型，怪异盒子模型(IE) 在学习弹性布局前，我们学过Float 浮动 和 Position 定位，浮动会出现一些 ‘诡异’ 的事情，定位则用起来相对麻烦，弹性布局用起来就会很舒服。 1.弹性 ......
css布局
布局 弹性布局： 关键字：display:flex justify-content:space-between 两端对齐，中间自适应 justify-content:space-around 均匀分布，两边距离等于中间间距 justify-content:space-evenly 平等均匀分布，两边 ......
css实现：不固定宽高，随内容宽度自动增长的圆形
css代码： .circle { display: inline-block; border-radius: 50%; min-width: 20px; min-height: 20px; padding: 5px; background: red; color: white; text-align ......
CSS-transparent--透明属性 用transparent写一个三角形
css transparent 是一种全透明属性。当用在一个元素覆盖另一个元素时，想显示下面的元素，就用到了transparent属性。 代码： div{ width: 0; height: 0; /* 边框底部 */ border-bottom: 100px solid black; /* 边框左 ......
CSS进阶1--字体样式-文本样式
link.css--连接外部样式表 1.文字样式： ①font-family：字体样式 ②font-style：文本的字体样式 属性：normal-正常 italic-斜体字样式显示 oblique-文字向一边倾斜（与italic类似，但不太支持） ③font-variant--以小型大写字体或正常 ......
CSS-background 背景图片
更多CSS进阶： https://www.cnblogs.com/warmNest-llb/p/17866954.html 1.背景介绍 元素的背景属性： background 简写属性，作用是将背景属性设置在一个声明中。 background-attachment：背景图像是否固定或者随着页面的其 ......
CSS
1、文字超出用省略号...鼠标悬停显示全部文字 <div style="font-size: 12px; margin-top: 30px; padding: 10px 20px; overflow: hidden; text-overflow: ellipsis; display:-webkit- ......
电视家APP，从此以后电视盒子只是盒子，再与电视毫无关系
广电总局封掉了电视家APP，于是我决定把我的“当贝盒子”挂咸鱼了，从此以后电视盒子就只是个盒子。 PS: 广电的一刀切简直是绝了，绝绝子。 ......
css三角形
https://blog.csdn.net/weixin_43951592/article/details/127442235 https://blog.csdn.net/m0_60237095/article/details/130076471 ......
大道至简-Shopify 构建弹性支付系统的 10 条原则
0 大纲 Lower the Timeouts, and Let the Service Fail Early Add Circuit Breakers Capacity Planning Add monitoring and alerting Implement Structured Loggin ......
【css】反向圆角，效果类似于谷歌浏览器的tab
<nav> <div :class="{ 'menu-item': true, 'activity': index == selectMenuIndex }" v-for="(menuInfo,index) in menuList" :key="index" @click="handelMenuCl ......
css值参
<div :style="{'--heiaght':headerHeight +'px' }"></div> div{ height:var(--heiaght) } 即可 ......
关于CSS3的学习
CSS的普通选择器：标签选择器、id选择器、类选择器、通用选择器(*)、分组选择器(将具有相同样式的元素放在一起，之间用","分隔)。注：类名和id名不能以数字开头。 rgba是rgb颜色的扩展，前三个值为三原色和rgb一致，第四个值是设置透明度的，1为完全不透明，0是完全透明为白色。hex颜色是用 ......
Css
CSS CSS样式规则 使用HTML时，需要遵从一定的规范。CSS亦如此，要想熟练地使用CSS对网页进行修饰，首先需要了解CSS样式规则，具体格式如下： 在上面的样式规则中: 1.选择器用于指定CSS样式作用的HTML对象，花括号内是对该对象设置的具体样式。 2.属性和属性值以“键值对”的形式出现。 ......
CSS-position 定位
1.介绍 css定位属性允许对元素进行定位改变其在页面的位置。 css有三种基本定位机制：普通流、浮动和绝对定位。 普通流的元素的位置由元素在html中的位置决定。 2.定位属性 设置偏移量：left、right、top、bottom（左、右、上、下） 3.定位方式 ①静态定位(static)：(很 ......
直播平台制作，css之如何清除浮动
直播平台制作，css之如何清除浮动 <style type="text/css"> li { list-style: none; height: 100px; width: 100px; float: left; background: red; margin-left: 20px; } .fath ......
css选择
类型选择器 类型指 h1 ,p,a这类 h1{ color：red; } 全局选择器以 *开头 类选择器 .highlight { background-color: yellow;} <h1 class="highlight">Class selectors</h1> 指向特定元素类 span.h ......
css基本
css被称为样式语言 本人理解 html 如是房子css 即是装修 p{ color: red; width: 500px; border: 1px solid black; } p整个结构称为规则 p->为选择器 选择多个元素 p, h1{ color: red; } <link href=pat ......
css伪类选择器
点击查看代码 :nth-child(){},用来选择父元素下的第n个子元素。 注意：:nth-child(){}是根据父元素下所有子元素进行排序 :nth-child(2n){}，选中父元素下偶数行的子元素。 :nth-child(2n+1){}，选中父元素下奇数行的子元素。 :nth-child( ......
CSS多行文本溢出显示省略号
## WebKit内核浏览器解决办法 > -webkit-line-clamp是用来限制在一个块元素显示的文本的行数 , display: -webkit-box 将对象作为弹性伸缩盒子模型显示； -webkit-box-orient 设置或检索伸缩盒对象的子元素的排列方式； text-overfl ......
css 发光文字
.textBox { font-family: "Microsoft YaHei"; font-size: 28px; font-weight: bold; white-space: nowrap; line-height: 40px; background: linear-gradient( 30 ......
css--rem/em
rem： rem单位，是相对单位 rem单位是相对于HTML标签的字号计算结果 1rem = 1HTML字号大小 rem - flexible.js： flexible.js是手淘开发出的一个用来适配移动端的js库。 核心原理就是根据不同的视口宽度给网页中html根节点设置不同的font-size。 ......
HTML+CSS+Javascript+Vue
Table of Contents I. HTML II. CSS Get Started I. HTML 按tab自动生成 Label Meaning Properties div 块状元素 span 行间元素 h1 - h6 标题 i icon图标 strong 字体加粗 a 超链接 img 插 ......