IT入门 > 面试题 > css题库 > 第二章 >

行内元素和块级元素有哪些

行内元素 一个行内元素只占据它对应标签的边框所包含的空间 一般情况下，行内元素只能包含数据和其他行内元素 b, big, i, small, ttabbr, acronym, cite, code, dfn, em, kbd, strong, samp, vara, bdo, b...

过渡与动画的区别是什么

transition 可以在一定的时间内实现元素的状态过渡为最终状态，用于模拟以一种过渡动画效果，但是功能有限，只能用于制作简单的动画效果而动画属性 animation 可以制作类似 Flash 动画...

文本超出部分显示省略号

单行 overflow: hidden; text-overflow : ellipsis; white-space : nowrap; 多行 display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3; // 最多显示几行overflow: hidden;...

display:none、visibile:hidden、opacity:0 的区别

是否隐藏 是否在文档中占用空间 是否会触发事件 display: none 是 否 否 visibile: hidden 是 是 否 opacity: 0 是 是 是...

一边固定宽度一边宽度自适应

可以使用 flex 布局 复制下面的 HTML 和 CSS 代码 用浏览器打开可以看到效果 div class = wrap div class = div1 / div div class = div2 / div / div .wrap { display : flex ; justify-content : space-between ;} .div1 { min-w...

什么时候用translate定位

translate() 是 transform 的一个值。改变 transform 或 opacity 不会触发浏览器重新布局（reflow）或重绘（repaint），只会触发复合（compositions）。而改变绝对定位会触发重新布局，进而触发重绘...

响应式设计与自适应设计有何不同？

p响应式设计和自适应设计都以提高不同设备间的用户体验为目标，根据视窗大小、分辨率、使用环境和控制方式等参数进行优化调整。 响应式设计的适应性原则：网站应该凭借一份代码...

你了解 CSS Flex

flex 容器中存在两条轴， 横轴和纵轴， 容器中的每个单元称为 flex item。 在容器上可以设置 6 个属性： flex-direction flex-wrap flex-flow justify-content align-items align-content 注意：当设置 flex 布局...

你使用过哪些现有的 CSS 框架？你是如何改进它们

Bootstrap ： 更新周期缓慢。Bootstrap 4 已经处于 alpha 版本将近两年了。添加了在页面中广泛使用的微调按钮组件。 Semantic UI ：源代码结构使得自定义主题很难理解。非常规主题系统的使用...

box-sizing:border-box会产生怎样的效果？

元素默认应用了 box-sizing: content-box ，元素的宽高只会决定内容（content）的大小。 box-sizing: border-box 改变计算元素 width 和 height 的方式， border 和 padding 的大小也将计算在内。 元素的...