![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
张贺_
合抱之木,生于毫末;九层之台,起于累土;千里之行,始于足下
展开
-
渐变 CSS linear-gradient
渐变渐变(Gradient)是 CSS3 引入的特性,其定义详见 CSS Images Module Level 3。它本质上是一个 2D 图像,可以对 background-image、list-style-image 和 border 等进行细微着色。渐变本身是没有固有尺寸的,虽然渐变框有具体大小要想指定一个渐变效果,只需定义这三个元素,即可:渐变线(gradient lin...原创 2019-03-25 14:40:59 · 387 阅读 · 0 评论 -
CSS3中transform属性详解
兼容性Internet Explorer 10、Firefox、Opera 支持 transform 属性。 Internet Explorer 10、Firefox、Opera 支持 transform 属性。Internet Explorer 9 支持替代的 -ms-transform 属性(仅适用于 2D 转换)。Safari 和 Chrome 支持替代的 -webkit-trans...原创 2020-04-10 17:24:46 · 515 阅读 · 0 评论 -
chrom下修改input输入框默认背景色
chrom浏览器的自动填充表单功能Autofill 在使用时,填充的表单输入框会变成奇葩默认的黄色底色,这对网页整体的观感造成了很大影响,而且处理起来很麻烦。分析:之所以会出现这种情况是因为 chrom会自动为 input 增加以下样式:input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofi...原创 2019-08-22 18:05:21 · 5219 阅读 · 0 评论 -
sass报错Invalid GBK character "\xE5"解决方案
今天在使用sass的时候发生错误:看得出是文档编码错误,在网上搜索解决方案,都说头部添加@charset "utf-8";即可;然而我头部添加有仍然会报此错误,后来找到答案:需要配置ruby环境:具体方案:找到ruby安装目录,我的是默认安装路径修改sass.ruby文件(编辑器打开):在所有的require XXXX 之后添加一行代码:Encoding.defa...原创 2018-08-29 21:54:21 · 2898 阅读 · 2 评论 -
sass环境配置
1.sass编译环境依赖于ruby 先下载ruby 本次下载的是 rubyinstaller-2.3.1-x64版本 安装2.将sass文件下载到本地 cmd 命令: get install 路径 :路径为本地sass文件路径 3.测试是否安装成功:ruby -v gem -v sass -v 查看安装的sass版本号4. 将...原创 2018-08-29 19:43:36 · 2363 阅读 · 0 评论 -
css面试题汇总
1 介绍一下标准的CSS的盒子模型?与低版本IE的盒子模型有什么不同的?标准盒子模型:宽度=内容的宽度(content)+ border + padding + margin低版本IE盒子模型:宽度=内容宽度(content+border+padding)+ margin2 box-sizing属性?用来控制元素的盒子模型的解析模式,默认为content-boxcontex...转载 2018-07-18 20:59:48 · 168 阅读 · 0 评论 -
CSS3中的动画使用详解
在了解css3中的动画之前,我们必须搞清楚一个问题:我们为什么要学习它,它能给我们带来什么好处。这个问题换种说法,就是css3中使用动画的意义:首先同样的动画效果我们用css3来实现要比用JS实现要简单的多,最重要的是从性能方面看,使用css3中的动画实现的效果远远比我们利用JS进行DOM操作的性能要好。当我们搞清楚这个问题,接下来看它的用法:1.首先@keyframes 声明...原创 2018-07-18 11:46:30 · 362 阅读 · 0 评论 -
css3中的3d属性实现一个星空效果
在css3新增属性的学习中,有关3d的知识,下面是利用transform属性的3d效果做的一个星空中星球围绕太阳旋转,实现了自转和公转效果;话不多说,直接code:HTML:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title&原创 2018-07-12 11:03:04 · 4399 阅读 · 6 评论 -
在IE(IE6)中常见的几个兼容性问题
1.图片间隙问题: 在高版本浏览器中,如果没有给父容器设置高度,图片会在原来基础上把父元素撑大3-5px; 解决办法:1.给父元素添加font-size:0; 2.给图片设置display:block;(推荐方法) 在低版本浏览器中(IE6),如果给父容器设置宽度后,图片会在原...原创 2018-07-03 21:33:34 · 2914 阅读 · 0 评论 -
BFC的作用及原理
Block Formatting contextFormatting context 是W3C CSS2.1规范中的一个概念。它是页面中的一块渲染区域,并且有一套渲染规则,它决定了其子元素将如何定位,以及和其它元素的关系和相互作用。最常见的 Formatting context 有Block fomatting context (简称BFC)和 Inline formatting context ...原创 2018-07-01 11:24:54 · 537 阅读 · 0 评论 -
元素的几种定位详解
absolutely:绝对定位 将对象从文档流中脱离出来,使用left/right/top/bottom等属性相对其最近的一个设置有定位的父元素进行绝对定位:如果不存在这样的父元素,则根据HTML(最大的包含块、浏览器)对象而起层叠通过z-index属性定义; 包含块是绝对定位的基础,是为绝对定位提供参照的参照物;...原创 2018-06-26 22:23:27 · 702 阅读 · 0 评论 -
css核心属性笔记总结
margin:0 auto 设置标签水平居中text-align:center 文本居中line-herght:行高 作用:1.给多行文本设置行高降低阅读困难 2.给单行文本设置行高时文本在容器中垂直居中(行高与容器同高)font-size:字体大小fon-family:设置字体//可以有多个值逗号隔开...原创 2018-06-22 22:01:57 · 385 阅读 · 0 评论