CSS&HTML
关注
分享
扫一扫
CSS&HTML
.01
据说写博客有助于学习
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
css工程化面试真题
如何解决CSS模块化问题Less Sass等CSS预处理器PostCSS插件（postcss-import/precss等）webpack处理CSS （css-loader + style-loader）PostCSS 可以做什么取决于插件可以做什么autoprefiixer cssnext precss等 兼容性处理import模块合并css语法检查 兼容性检查压缩文件cssn...原创 2020-02-20 18:16:23 · 139 阅读 · 0 评论 -
CSS与webpack
webpackJS是整个应用的核心入口一起资源均由JS管理依赖一切资源均有webpack打包发布npm install webpack webpack-cli --save-dev安装原创 2020-02-20 16:42:57 · 195 阅读 · 0 评论 -
CSS工程化简单介绍 PostCSS介绍与插件使用
css工程化在不同公司有不同做法，主要关注四个方面组织：代码的组织，怎么划分模块，怎么更方便合作优化：代码怎样写更好，团队合作中为什么要这么做构建：代码的压缩、上线等等维护PostCSS介绍知识CSS->PostCSS解析转化->CSSPostCSS解析转化阶段可以做的事: 模块化，加前缀，兼容性等等PostCSS本身只有解析能力各种神器特性全靠插件目前至少有20...原创 2020-02-19 22:24:28 · 175 阅读 · 0 评论 -
CSS五种布局方式
是CSS知识体系的重中之重早期以table为主（简单）后来以技巧性布局为主（难）现在有flexbox/grid(偏简单)响应式布局是必备知识常用布局方法table表格布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name...原创 2020-02-19 20:45:17 · 4847 阅读 · 0 评论 -
CSS非布局样式补充
雪碧图的原理利用background的属性，大小、位置、position位移自定义字体的使用场景宣传/品牌/banner等固定文案字体图标伪类和伪元素的区别伪类表状态伪元素是真的有元素前者单冒号，后者双冒号如何美化checkboxlabel[for]和id隐藏原生input:checked + label...原创 2020-02-19 16:47:02 · 106 阅读 · 0 评论 -
CSS Hack与CSS美化Checkbox
CSS Hack只在特定浏览器生效的写法就叫css hackHack即不合法但生效的写法主要用于区分不同浏览器缺点：难理解 难维护 容易失效替代方案：特性检测替代方案： 针对性加class注意：标准属性写前面，hack写后面案例-checkbox<!DOCTYPE html><html><head> <meta charse...原创 2020-02-19 16:37:40 · 268 阅读 · 0 评论 -
CSS非布局样式滚动、文字折行、装饰性属性及其它
非布局样式-滚动滚动行为和滚动条visible 超出则撑出容器hidden 超出直接隐藏scroll 一定有有滚动条auto 没超出没有滚动条，超出则有滚动条非布局样式-文字折行overflow-wrap(word-wrap)通用换行控制-是否保留单词word-break 针对多字节文字-设置中文句子是单词 或者中文字为单词white-space 空白处是否断行<...原创 2020-02-19 16:25:57 · 372 阅读 · 0 评论 -
CSS非布局样式背景、边框
非布局样式-背景知识点背景颜色hsla(60,100%,50%) 四个参数： 颜色（0-360）、饱和度、亮度、透明度hsl（）可以不设透明度渐变色背景background: -webkit-linear-gradient(left, red, green);background: linear-gradient(to right, red, green); 线性渐变demo1...原创 2020-02-19 15:58:48 · 209 阅读 · 0 评论 -
CSS非布局样式字体、行高
非布局样式字体、字重、颜色、大小、行高背景、边框滚动、换行粗体、斜体、下划线其它字体族一堆字体serif衬线字体sans-serif非衬线字体monospace等宽字体cursive手写体fantasy花体多字体fallback按照字体排列顺序逐个适配，直到有适配的。<!DOCTYPE html><html...原创 2020-02-19 13:10:44 · 322 阅读 · 0 评论 -
CSS用途、分类、权重、性能
CSS基础Cascading Style Sheet层叠样式表选择器{ 属性:值; 属性:值}分号是分隔符选择器：1. 用于匹配HTML元素有不同的匹配规则，多个选择器可叠加2. 分类和权重选择器分类元素选择器a{}伪元素选择器::before{}类选择器.link{}属性选择器 [type=radio]{}伪类选择器:hover{}ID选择器 #id{}...原创 2020-02-18 19:50:57 · 164 阅读 · 0 评论 -
HTML元素分类、嵌套关系、默认样式、面试真题
HTML元素分类按样式分block块级 单独一行，块状inline行内/内联 不一定什么形状inline-block内联块级<div>DIV元素</div><p><span>内联元素</span><em>内联元素</em><strong>好巧，我也是内联元素&...原创 2020-02-18 16:44:42 · 293 阅读 · 0 评论 -
HTML5新增内容
HTML版本HTML4/4.01(SGML) 浏览器容错性特别高XHTML(XML) 要求非常严格 HTML５之前很流行HTML5 新增内容新区块标签:section 区块 代标题 可能出现在大纲中article 区块 带标题 可能出现在大纲中nav 导航 可能出现在大纲中aside 一般不出现在大纲中表单增强:日期, 时间, 搜索表单验证Placeholder自动聚焦...原创 2020-02-18 13:48:03 · 682 阅读 · 0 评论 -
HTML常见元素和HTML语义化
HTM常见元素和理解常见元素header区meta title style link script base页面相关资源等, 页面上不直接显示body区div/section/article/aside/header/footerpspan/em/strong表格: table/thead/tbody/tr/td列表: ul/ol/li/dl/dt/dd链接: aform/...原创 2020-02-18 13:27:18 · 174 阅读 · 0 评论 -
CSS部分导学
目录HTML和CSS基础知识HTML元素的分类和特性HTML元素默认样式和定制化CSS选择器全解析CSS常见属性逐一讲解CSS布局实战布局属性和组合解析常见布局方案介绍三栏布局案例国内大战布局方案拆解动画和效果专题讲解多背景多投影特效3D特效编写实践过渡动画和关键帧动画实践动画细节和原理深入解析框架集成和CSS工程化预处理器作用和原理Less/Sass代码实践...原创 2020-02-18 12:36:23 · 137 阅读 · 0 评论