欢迎来到码农权的博客 MaNongGeGe.|

随笔分类 -  CSS

一行css代码画一个三角形
摘要:clip-path: polygon(50% 0, 0 100%, 100% 100%)
4
0
0
过渡与动画
摘要:## 过渡与动画 * 使用过渡和动画,可以让css属性变化的更加丝滑; * 过渡和动画无法对所有的css属性产生影响,能够产生影响的只有数值类属性,例如:颜色、宽高、字体大小等(支持数值类的过渡)。 ### 过渡 `transition: 过度属性 持续时间 过度函数 过度延迟` (谁过渡,过渡时间
9
0
0
CSS画三角
摘要:### 不追求三角形描边 ```scss &::after { position: absolute; content: ""; display: block; width: 0; height: 0; border: 10px solid; border-color: transparent tr
3
0
0
css伪类选择器大全
摘要:# 伪类选择器 > css伪类选择器大全: > > https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-classes | 伪类 | 含义 | | | | | :link | 选中未访问过的超链接 | | :visited | 选中已访问过
16
0
0
a标签伪类设置后不生效
摘要:### a标签伪类设置后不生效 * 检查书写伪类顺序是否正确 * link -> visited -> hover -> active ```css a { /* 未访问过*/ &:link { color: green; } /* 访问过 */ &:visited { color: red; }
38
0
0
最大最小宽高
摘要:## 最大最小宽高 - 最大宽度:`max-width`,最大高度:`max-height` - 最小宽度:`min-width`,最小高度:`min-height` 当一个元素的尺寸会自动变化时,设置最大最小宽高,可以让它不至于变得过小或过大。 在实际开发中,我们通常为PC端的页面设置一个最小宽度
46
0
0
尺寸的百分比
摘要:## 尺寸的百分比 绝大部分可以书写尺寸的地方,都可以书写百分比 百分比是一个相对单位,其相对于元素的**参考系**,比如: - 普通元素的参考系为**父元素的内容区域** - 绝对(固定)定位元素的参考系为父元素中**第一个定位元素的padding区域+内容区域** 下面罗列常见的百分比情况 |
18
0
0
颜色的alpha通道
摘要:颜色的alpha通道标识了色彩的透明度,它是一个0~1之间的取值,0标识完全透明,1标识完全不透明 在css中使用rgba可以为颜色添加alpha通道 ```css .alpha { /* 一个完全透明的颜色,等同于 transparent */ color: rgba(0, 0, 0, 0); /
60
0
0
css定位经验
摘要:### 绝对定位特性 * 当一个元素开启绝对定位后,元素会自动变成block盒。 ### 什么时候使用绝对定位 * 下面三个条件满足任何一个时,使用绝对定位: 1. 元素出现在一个天马行空的位置 2. 元素是否存在,不影响其他元素的排列 3. 单个元素在某个区域内水平垂直居中 ### fixed和a
6
0
0
css 实现div内显示两行或三行,超出部分用省略号显示
摘要:css 实现div内显示两行或三行,超出部分用省略号显示 一、div内显示一行,超出部分用省略号显示 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 二、div内显示两行或三行,超出部分用省略号显示 .line__3 {
9541
0
0
伪类和伪元素的区别
摘要:伪类和伪元素的区别 概述 W3C定义 伪类:css伪类用于向某些选择器添加特殊效果。 伪元素:css伪元素用于将特殊的效果添加到某些选择器。 总结 首先两者都是与选择器有关,第二就是添加一些特殊效果,当然这里的特殊效果指的是两者描述了其他css无法描述的东西。 伪类种类 伪类 作用 :active
40
0
0
meta配置总结
摘要:<!DOCTYPE html> <!--H5标准声明,使用 HTML5 doctype,不区分大小写--> <head lang=”en”> <!--标准的 lang 属性写法--> <meta charset=’utf-8′> <!--声明文档使用的字符编码--> <meta http-equiv
25
0
0
transition用法
摘要:transition过渡 transition简介 transition用来定义元素样式变换时的过渡效果。 css3的transition允许CSS的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击,获得焦点,被点击或对元素任何改变中触发,并平滑地以动画效果改变CSS的属性值。 写法 tr
867
0
0
css3box-sizing
摘要:盒模型 box-sizing: content-box; 即普通盒模型 box-sizing: border-box; 即怪异盒模型 注意:浏览器默认的是普通盒模型也就是 box-sizing:content-box; 普通盒模(标准盒模型)型的特征 在使用border和padding之后是向外扩展
46
0
0
什么是BFC?BFC是什么?为什么会有BFC
摘要:块级格式化上下文(Block Formatting Context)简称BFC BFC的目的就是:形成一个完全独立的空间,让空间中的子元素不会影响到外面的布局。如何才能形成这样一个神奇的空间呢? 我们通过CSS为元素设置一些属性,就能触发,常用的有四种: float不为none postion不为r
362
0
0
flex布局
摘要:子项目剩余分配详细总结
31
0
0
重置样式CSS
摘要:重置样式就是一组CSS声明,用来覆盖不同浏览器渲染HTML元素时的各种默认样式。重置样式一般会被加入到主样式文件的开头,用来将各个浏览器的自有默认样式重置成统一表现,确保样式表中后续追加的样式在不同浏览器中有相同的显示效果。世界上没有完美的重置样式,许多开发者都有自己的一套。以下是Eric Mere
293
0
0
点击右上角即可分享
微信分享提示
深色
回顶
收起
  1. 1 不将就 码农权
  2. 2 Bleeding Love 码农权
  3. 3 想你念你 码农权
Bleeding Love - 码农权
00:00 / 00:00
An audio error has occurred, player will skip forward in 2 seconds.

Not available