css主题的文章列表，还有css的技术要点_第11页

css before和after伪元素应用

1、说明":before"伪元素可以在元素的内容前面插入新内容。":after"伪元素可以在元素的内容之后插入新内容。伪元素默认展示为inline，即display:inline; 必须写content属性，不然伪类不起作用！ 2、兼容性伪元素有2种写法，单冒号和双冒号，单冒号和双冒号作用是一样的。...

代码星球 ·2021-02-14

SCSS 实用知识汇总

1、变量声明$nav-color:#F90;nav{//$width变量的作用域仅限于{}内$width:100px;width:$width;color:$nav-color;}.a{//报错，$width未定义width:$width;}2、父选择器&scss代码：articlea{color:blue;&...

代码星球 ·2021-02-14

CSS实现水平垂直居中方式

1、定位核心代码实现请看示例代码中的注释：<!DOCTYPEhtml><htmllang="zh"><head><metacharset="UTF-8"/><title>CSS水平垂直居中实现方式--定位实现</title><styletyp...

代码星球 ·2021-02-14

CSS nth-child、first-child、last-child、nth-of-type、first-of-type和last-of-type选择器使用

以下示例主要讲解nth-child、first-child、last-child、nth-of-type、first-of-type和last-of-type使用。示例代码：<!DOCTYPEhtml><htmllang="zh"><head><metacharset="UTF...

代码星球 ·2021-02-14

CSS编写规范

一、面向对象CSS（OOCSSS）OOCSS规则一：结构和皮肤分离如.btn， .btn-info，.btn-warning.btn{display:inline-block;margin-bottom:0;font-weight:normal;text-align:center;vertical-align...

代码星球 ·2021-02-14

检测和删除多余无用的css

本文主要讲解如何检测页面中多余无用的css。1、chrome浏览器F12审查元素的Audits说明：使用Audits，会检测出页面中没有用到的css，需要手动删除多余的css；同时需要说明的是检测出多余无用的css块，而不是某一行css。2、CSSusage插件（1）安装Firefox浏览器（2）安装firebugFi...

代码星球 ·2021-02-14

css 实用代码汇总

1、table排版（防止td文字过多导致table变形）table{/*为表格设置合并边框模型*/border-collapse:collapse;border-spacing:0;/*固定表格布局*/table-layout:fixed;}td{/*允许在单词内换行。*/word-break:break-word;}...

代码星球 ·2021-02-14

fis3 scss 版本报错

fis3scss编译需要安装的node版本为4.x,node版本高了fis会报错。如下图所示： ...

代码星球 ·2021-02-14

CSS3 GPU硬件加速

1<!DOCTYPEhtml>2<htmllang="zh-CN">34<head>5<metacharset="UTF-8">6<metahttp-equiv="X-UA-Compatible"content="IE=edge,chrome=1">...

代码星球 ·2021-02-14

CSS3 transition 浏览器兼容性

1、兼容性根据canius（http://caniuse.com/#search=transition），transition 兼容性如下图所示： 1<!DOCTYPEhtml>2<html>3<head>4<style>5div6{7wi...

代码星球 ·2021-02-14

CSS实现垂直居中的方法

(1)css+html代码1<!doctypehtml>2<htmllang="en">34<head>5<metacharset="UTF-8"/>6<title>Document</title>7<styletype="text/css"...

代码星球 ·2021-02-14

php 前端自动更新css和js，防止页面缓存

<?phpfunctionautoVer($url){$ver=filemtime($_SERVER['DOCUMENT_ROOT'].$url);echo$url.'?v='.$ver;}?><head><metahttp-equiv="Content-Type"content="tex...

代码星球 ·2021-02-14

CSS 表头不设置hover，tr:hover覆盖td的背景色

如果td有背景色tr:hover覆盖td的背景色tr:hovertd{background:#B6E8Ea;}======================================================================================================tr:...

代码星球 ·2021-02-14

关于 css padding 的使用 padding会将使用该属性的元素撑开

.right_img_box{width:300px;height:250px;border:1pxsolid#c9c9c9;margin-bottom:15px;background:#fff;padding:7px;}.right_aimg{width:300px;height:210px;} 使用pad...

代码星球 ·2021-02-14

Vue笔记：引入animate.css

转载：https://www.cnblogs.com/cbpm-wuhq/p/12753312.html在命令行中执行：npminstallanimate.css--savemain.js中：importanimatedfrom'animate.css'//npminstallanimate.css--save安装，在...

代码星球 ·2021-02-14