![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
css常用
熙哥_tito
这个作者很懒,什么都没留下…
展开
-
css网格布局的用法
* 有几个auto 就有几个值,还可以设置成px *//*网格之间的空隙为10px是grid-row-gap 行空隙 和 grid-column-gap: 列空隙 的简写*/: 10px;/*: 1 / 4;//与下边相同, span 省略了*//*和的简写属性 *//*表示跨越几行 *//*: 1 / 3;//与下边相同, span 省略了*//*和的简写属性 *//* span 表示跨越几列 */您可使grid-area。。原创 2023-06-06 14:02:21 · 146 阅读 · 0 评论 -
z-index 的基本使用
h2 class="jsj words">这个是很长的一段文字可能会被挡住</h2>z-index 的值为负数 元素显示在底层;数值越大,展示层级越高;/*z-index 的值为负数 元素显示在底层*/原创 2023-06-06 10:18:52 · 112 阅读 · 0 评论 -
position 的使用
固定/相对于视口定位,即使这意味着即使滚动页面,它也始终位于同一位置</tag></button><button class="btn abso">absolute<tag>绝对/相对于最近的定位祖先元素进行定位</tag></button><button class="btn stick">sticky<tag>粘性/根据用户的滚动位置进行定位原创 2023-06-06 10:17:31 · 51 阅读 · 0 评论 -
line-height 深究
当line-height:150%的效果,父元素的行高为150%时,会根据父元素的字体大小先计算出行高值然后再让子元素继承。当line-height:1.5em的效果,父元素的行高为150%时,会根据父元素的字体大小先计算出行高值然后再让子元素继承。当line-height:1.5的效果,父元素行高为1.5时,会根据子元素的字体大小动态计算出行高值让子元素继承原创 2023-06-06 10:11:56 · 39 阅读 · 0 评论 -
css保持元素纵横比:新属性
/* 纵横比 css 新属性 */ aspect-ratio: 1/2;原创 2023-06-05 11:44:00 · 176 阅读 · 0 评论 -
清除浮动的方式除了overflow 还可以用clear
清除浮动的方式除了overflow 还可以用clear;在外层元素的伪元素中 设置clear:both; content: "";display:table;原创 2023-06-05 11:40:59 · 43 阅读 · 0 评论 -
酷炫 css 按钮 边框霓虹
按钮动画效果:通过层级 伪元素 css 动画实现原创 2023-06-05 11:39:11 · 242 阅读 · 0 评论 -
css 选择器基本使用
选择器的基本使用,选择 元素内的所有 元素;父元素是 元素的所有 元素;紧随 元素之后的 元素; 前面有 元素的每个 元素原创 2023-06-05 11:16:57 · 33 阅读 · 0 评论 -
元素是浮动的,如何让其居中?
浮动的元素 要设置居中 可以在外层包裹一个div 然后加上 width: fit-content; margin: 0 auto ; 这样可以设置为水平居中;原创 2023-06-05 11:22:53 · 304 阅读 · 0 评论 -
css 实现下拉的方式
css实现下拉的方式: 要下拉的容器,默认给样式display: none; hover的时候display:block;原创 2023-06-03 10:21:23 · 240 阅读 · 0 评论 -
常用伪元素的使用
*::selection 用于用户选择的部分,可以设置样式为背景background 颜色color 鼠标cursor 和轮廓 outline*//*::before 伪元素可用于在元素内容之前插入一些内容。/*::first-letter 作用于块状元素,内容的首字母*//*::first-line 作用于块状元素 ,内容的首行*//* ::after 用于在元素后边插入一些内容 */原创 2023-06-03 10:12:15 · 44 阅读 · 0 评论 -
图像精灵的基本使用
img id="home" src="trans.gif"> - 仅定义小的透明图像,因为 src 属性不能为空。而实际显示的图像将是我们在 CSS 中指定的背景图像。- 定义背景图片及其位置(left:0px, top:0px)-- trans.gif 是一张透明图片,因为没有这个图片,所以显示出来的有问题 -->width: 46px;- 定义我们要使用的图像部分大小。原创 2023-06-03 10:03:16 · 93 阅读 · 0 评论 -
属性选择器
属性选择器的用法原创 2023-06-03 09:37:13 · 49 阅读 · 0 评论 -
带三角箭头的悬浮提示
画一个三角形:容器宽高为0;其中一条border 有颜色、实线、宽度;其余三条border 宽度、实线、transparent。原创 2023-06-03 09:32:01 · 143 阅读 · 0 评论