HTML与CSS知识主题的文章列表，还有HTML与CSS知识的技术要点_第26页

webpack插件html-webpack-plugin

1、插件安装npminstallhtml-webpack-plugin--save-dev2、插件使用webpack.config.js配置文件为：varhtmlWebpackPlugin=require('html-webpack-plugin');module.exports={//打包入口entry:{main:...

代码星球 ·2021-02-14

CSS3 calc()函数使用

1、calc是什么？calc是英文单词calculate(计算)的缩写，用于动态计算长度值。calc()函数支持"+","-","*","/"运算；+和 -运算符的两边必须始终要有空白符。比如 calc(50%-8px)会被解析成为一个无效的表达式：一个百分比后跟一个负数长度值。而calc(8px+...

代码星球 ·2021-02-14

CSS3 选择器浏览器兼容性汇总 IE8

1、css选择器css（包括css1、css2和css3）有哪些选择器？http://www.w3school.com.cn/cssref/css_selectors.asp 2、CSS3选择器因为CSS1和CSS2选择器浏览器兼容性很好，因此本文主要讲解CSS3选择器，CSS3选择器一共有21个，他们为：3...

代码星球 ·2021-02-14

css before和after伪元素应用

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

代码星球 ·2021-02-14

html中title属性换行实现

本文主要讲解titile属性换行的实现方式。<title>元素可定义文档的标题，可以应用在img、a等标签上。1、实现方式：<!DOCTYPEhtml><htmllang="zh"><head><metacharset="UTF-8"/><title&g...

代码星球 ·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

html 语义化标签拾遗

1、del和ins标签兼容性：浏览器全部支持del：定义文档中已被删除的文本。ins：定义已经被插入文档中的文本。<!DOCTYPEhtml><htmllang="zh"><head><metacharset="UTF-8"/><title>html标签使用&...

代码星球 ·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

html中切记ID不能重复

1<!DOCTYPEhtml>2<htmllang="zh">3<head>4<metacharset="UTF-8"/>5<metaname="viewport"content="width=device-width,initial-scale=1.0"/>...

代码星球 ·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