一、CSS基础

1、选择器

选择器{

属性:值;

属性:值

}

作用:用于匹配HTML元素、分类和权重、解析方式和性能、值得关注的选择器

分类:

  • 元素选择器a{}
  • 伪元素选择器::before{}
  • 类选择器 .link{}
  • 属性选择器[type=radio]{}
  • 伪类选择器 :hover{}
  • ID选择器#id{}
  • 组合选择器 [type=checkbox]+labei{}
  • 否定选择器 :not(.link){}
  • 通用选择器*{}

权重:

  • ID选择器 #id{} +100
  • 类 属性 伪类 +10
  • 元素 伪元素 +1
  • 其它选择器 +0

2、非布局样式

字体

  • 字体族
  • 多字体fallback
  • 网络字体、自定义字体
  • 网站:iconfont.cn

行高

  • 行高的构成
  • 行高相关的现象和方案
  • 行高的调整

背景

边框

滚动

文本折行

装饰性属性

3、hack 和案例

二、CSS布局

1 、布局简介

2、 布局方式(表格)

3、 一些布局属性

4、 flexbox布局

5、 float布局

6 、inline-block布局

7 、响应式布局

8 、主流网站使用的布局方式

三、CSS效果

1 、box-shadow

2 、text-shadow_x264

3、 border-radius

4、 background

5、 clip-path

6、 3D-transform

四、CSS动画

1 、动画介绍

2 、transition动画(1)

4、 keyframes动画

5、 逐帧动画

CSS面试复习(二):CSS的使用的更多相关文章

  1. CSS面试复习(三):预处理器、工程化方案、三大框架中的CSS

    一.预处理器 1.介绍 基于CSS的另一种语言.通过工具编译成CSS.添加了很多CSS不具备的特性.能提升CSS文件的组织 2.less嵌套 3 .sass嵌套 4. less变量 5.sass变量 ...

  2. CSS面试复习(一):HTML强化

    1. HTML常见元素和理解 head类 meta:字符集.base:路径. a[href,target] img[src,alt] table td[colspan,rowspan] form[ta ...

  3. CSS基础语法(二) CSS的9种选择器

    样式表的选择器 1.类选择器 根据HTML标签的class属性选择样式应用的属性 .类值{ … } 2.ID选择器 根据HTML标签的ID属性选择样式应用的元素 #id值{ … }  3.标签选择器 ...

  4. web前端知识大纲:系列二 css篇

    web前端庞大而复杂的知识体系的组成:html.css和 javascript 二.css 1.CSS选择器 CSS选择器即通过某种规则来匹配相应的标签,并为其设置CSS样式,常用的有类选择器.标签选 ...

  5. HTML&CSS面试高频考点(二)

    HTML&CSS面试高频考点(一)    ♥ 6. W3C盒模型与怪异盒模型 标准盒模型(W3C标准) 怪异盒模型(IE标准) 怪异盒模型下盒子的大小=width(content + bord ...

  6. CSS面试细节整理(二)

    5.css盒模型: CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框 和 外边距 的方式

  7. 总结CSS面试题目的考察点及常见布局问题整理

    整理网上流传的若干份面试题目,突发奇想,总结关于CSS面试题目的考察点,发现问题大多围绕几个属性和几种题目,水平有限,仅供参考. 写这个博文内心有种莫名奇妙的自我谴责感,实在不应该把面试层叠样式“应试 ...

  8. web前端面试试题总结---css篇

    CSS 介绍一下标准的CSS的盒子模型?低版本IE的盒子模型有什么不同的? (1)有两种, IE 盒子模型.W3C 盒子模型: (2)盒模型: 内容(content).填充(padding).边界(m ...

  9. HTML和CSS的复习总结

    HTML(Hypertext Markup Language)超文本标记语言:其核心就是各种标记!<html> HTML页面中的所有内容,都在该标签之内:它主要含<head>和 ...

随机推荐

  1. QML-关于Qt.rgba()颜色无法正常显示问题

    GitHub:八至 作者:狐狸家的鱼 本文链接:关于Qt.rgba()颜色的正确写法 当在正常给color属性写颜色的时候,用十六进制能正常显示,但是用Qt.rgba()时,颜色无法正常显示出来. 按 ...

  2. CF528D Fuzzy Search

    题意:给定k,只含有ACGT的字符串S和T,求T在S中出现了多少次. 字符匹配:如果S的[i - k, i + k]中有字符x,那么第i位可以匹配x. 解: 首先预处理:f[i][j]表示S的第i位能 ...

  3. AtCoder arc061C Snuke's Subway Trip

    大意: 给你一张无向图,边有种类. 当你第一次/重新进入某种边时费用 + 1 在同一种边之间行走无费用. 求 1 到 n 的最小费用. 嗯...乍一看有一个很直观的想法:记录每个点的最短路的上一条边的 ...

  4. 利用selenium并使用gevent爬取动态网页数据

    首先要下载相应的库 gevent协程库:pip install gevent selenium模拟浏览器访问库:pip install selenium selenium库相应驱动配置  https: ...

  5. 第十三篇-通过Button设置文本背景颜色

    MainActivity.java package com.example.aimee.buttontest; import android.annotation.SuppressLint; impo ...

  6. 第十二节、尺度不变特征(SIFT)

    上一节中,我们介绍了Harris角点检测.角点在图像旋转的情况下也可以检测到,但是如果减小(或者增加)图像的大小,可能会丢失图像的某些部分,甚至导致检测到的角点发生改变.这样的损失现象需要一种与图像比 ...

  7. 深入理解JS函数中this指针的指向

    函数在执行时,会在函数体内部自动生成一个this指针.谁直接调用产生这个this指针的函数,this就指向谁. 怎么理解指向呢,我认为指向就是等于.例如直接在js中输入下面的等式: console.l ...

  8. 2017-12-15python全栈9期第二天第七节之运算符

    #!/user/bin/python# -*- coding:utf-8 -*-print(3>4 or 4<3 and 1==1)print(1<2 and 3 <4 or ...

  9. 运维监控-使用Zabbix Server 创建 Actions

    运维监控-使用Zabbix Server 创建 Actions 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. zabbix的action默认是关闭的,因此我们想使用它就得先启用哟. ...

  10. 【.NET】asp.net Redirect 图片路径

    #需求: 前端通过<img>的src向服务端请求图片信息,如果不存在想要的图片,那么就返回一张默认路径下的图片: #实现: <img class="related_reso ...