程序员书籍笔记 程序员书籍笔记
  • HTML
  • CSS
  • JavaScript
  • 前端知识
  • Vue
  • MarkDown
  • git
  • Node.js
  • Linux
  • 51单片机
  • 四级
  • 第一学期课程
  • 操作系统
  • 计算机网络
  • 数据结构
  • 计算机组成原理
  • HTML5
  • Electron
  • 日记便签
  • 前端导航
GitHub (opens new window)
  • HTML
  • CSS
  • JavaScript
  • 前端知识
  • Vue
  • MarkDown
  • git
  • Node.js
  • Linux
  • 51单片机
  • 四级
  • 第一学期课程
  • 操作系统
  • 计算机网络
  • 数据结构
  • 计算机组成原理
  • HTML5
  • Electron
  • 日记便签
  • 前端导航
GitHub (opens new window)
  • HTML

  • CSS

    • CSS规范
    • 基础
    • 选择器
    • 元素显示
    • 元素背景属性
    • CSS三大特征
    • 盒子模型
    • CSS浮动
    • CSS四种定位
    • CSS显示
    • CSS技巧
      • 三角图标
      • 遮罩案例
    • CSS3基础
    • CSS2D转3D
    • 移动端布局
    • 移动端适配
    • 响应式布局
    • CSS的查询属性
  • JavaScript

  • GO

  • 正则表达式

  • java

  • TypeScript

  • react

  • 前端知识

  • jQuery

  • Python

  • C和C++

  • 前端和后端
  • CSS
yuadh
2021-08-28
目录

CSS技巧

# 三角图标

原理是 宽度为零的盒子 边框的显示构成的不同形状效果

在同边框宽度为0的情况下又有其它的边框填充 效果-

See the Pen by yuandehua (@yuandehua) on CodePen.

demo01

See the Pen by yuandehua (@yuandehua) on CodePen.

# 遮罩案例

利用绝对定位的脱离标准流的原理

See the Pen by yuandehua (@yuandehua) on CodePen.

编辑 (opens new window)
上次更新: 2023/02/07, 14:51:48
CSS显示
CSS3基础

← CSS显示 CSS3基础→

Theme by Vdoing | Copyright © 2021-2023 yuadh
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式
×