css
-
css实现可收缩的上下左右布局
首先我们来看一下实现效果： （推荐教程：CSS教程） 代码实现： 立即学习“前端免费学习笔记（深入）”； 布局 * { margin: 0; padding: 0; } html, body { width: 100%; height: 100%; } .left { width: 220px; h…
-
css实现一个简单的扁平化按钮
我们先来看下按钮样式： （推荐教程：CSS教程） 具体代码： 立即学习“前端免费学习笔记（深入）”； 打印//js写法$(“#btn”).css({“font-family”: “‘微软雅黑’,’Helvetica Neue’,Helvetica,Arial,sans-serif”,”font-si…
-
谈谈css中的3种预处理器
本篇文章给大家介绍一下三种css预处理器的，以及比较一下，了解他们之间的差异。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。 一、介绍 CSS预处理器定义了一种新的语言，基本的思想是用一种专门的编程语言，开发者只需要使用这种语言进行编码工作，减少枯燥无味的CSS代码的编写过程的同时…
-
前端常见css的面试题目
随着疫情的不断好转，各地都开始逐步的复工，当然对我们来说，也马上迎来所谓的金三银四跳槽季。在此，分享自己在前端领域中积累的一些经验，供自己温故知新。 对于前端来说，涉及的知识面广，内容繁多，但是万变不离其宗，主要也就是围绕着html(5)，css(less,scss,sass,styus,css…
-
谈谈CSS实现水平垂直居中布局的方法
最近面试的时候，面试官问到了CSS水平垂直居中布局的方式，对于刚入前端没多久的我，无疑是一脸懵逼，闲了赶紧查阅资料分析一波，给各位分享一下，避免落坑。 首先先说明一下html和一些基础css样式，下面就不再赘述！html 垂直水平居中 公共css代码如下 /* 公共样式 */.div1{width:…
-
在html元素中设置css样式的方式是什么
如果我们要在HTML元素中设置CSS样式，那么我们就需要在元素中设置”id” 和 “class”选择器。 （推荐教程：CSS教程） 下面我们来分别说一下id选择器和class选择器。 id选择器 立即学习“前端免费学习笔记（深入）”； id 选择器可以…
-
css如何设置透明度不会影响子元素
通过RGBA设置透明度，只有最新的浏览器支持，支持IE9+，可通过RGBA的alpha通道的方式设定。 （推荐教程：CSS教程） 显示文字 前三个值是rgb的颜色值，最后一个透明度的值，取值为0~1，值越小越透明。 兼容所有浏览器写法： 立即学习“前端免费学习笔记（深入）”； background-…
-
css怎样实现DIV高度自适应
可以添加表格特性。 （推荐教程：CSS教程） 父级元素添加属性 display: table; 子一级元素添加属性 display: table-cell; 立即学习“前端免费学习笔记（深入）”； 代码： .div-row { width: 400px; border: 1px solid #23…
-
css中的五种常见页面布局
公共样式部分代码： （推荐教程：CSS教程） html * { margin: 0; padding: 0; } .layout { margin-bottom: 20px; } .layout article { width: 100%; } .layout article > div { …
-
利用css实现鼠标悬停效果
我们先来看下效果： （推荐教程：CSS教程） html代码： 立即学习“前端免费学习笔记（深入）”； 这是是pic-1 这是是pic-2 这是是pic-3 css代码： html { box-sizing: border-box; font: 18px PT Mono; background: an…
