掌握技术面试的 50 多个 CSS 问题和挑战
对于任何寻求第一次机会或申请工作的人来说,进入技术面试阶段是最令人期待的里程碑之一。如果您正在申请前端职位,您可能需要 解决一些关于 CSS 的测试和回答问题 .
考虑到这一点,我编制了一份清单 一些最常见的 CSS 问题和问题 候选人面临的。让我们开始吧!
问题
一般的
- 什么是 CSS?
- CSS从哪一部分处理 结构-表现-行为 在网页中?
- 编写一个简单的 CSS 语法并解释它的每个部分。
- CSS如何包含在HTML文件中?解释不止一种方式。
选择器
- 什么是 CSS 选择器?
- CSS 中有哪些不同类型的选择器?
- 如何编写类型选择器?
- 如何编写 ID 选择器?
- 如何编写类选择器?
- 如何编写属性选择器?
- 如何将多个选择器分组为一个通用样式?
- 如何编写通用选择器?
组合器
- CSS 中的组合子是什么?
- 什么是后代组合器?你怎么能写一个?
- 什么是子组合器?你怎么能写一个?
- 什么是相邻兄弟组合子?你怎么能写一个?
- 什么是通用兄弟组合子?你怎么能写一个?
伪类和元素
- 什么是伪类?
- 选择器中的伪类是怎么写的?
- 什么是伪元素?
- 选择器中的伪元素是怎么写的?
单位
- CSS 中用于长度值的不同单位是什么?
- 举一些绝对和相对长度单位的例子。
- 有什么区别
时间
和雷姆
? - 有什么区别
时间
,像素
,pt
和%
? - 什么是
大众
和vh
?
颜色值
- 如何在 CSS 中定义颜色值?
- 如何在 RGB 中定义颜色值?
- 如何在 HEX 中定义颜色值?
- 如何在 HSL 中定义颜色值?
- 颜色值中的 alpha 值是什么?
盒子模型
- CSS中的盒子模型是什么?
- 盒子模型有哪些不同的组成部分?
- 什么是填充?
- 什么是保证金?
- 什么是边界?
- 什么是大纲?
- Outline 与 Border 有何不同?
- 如何计算元素的总宽度和高度?
- box-sizing 属性有什么用?
- box-sizing 属性的不同值是什么?
挑战
CSS 选择器
- 全部着色
p
粉红色的元素 - 用 id 为元素的文本着色
e72
变蓝 - 用类为所有元素着色
字幕
变红 - 在一条规则中,为所有颜色着色
p
和部分
橙色元素
背景
- 将整个页面的背景颜色设置为红色
- 为整个页面设置背景图片
- 显示在整个页面中重复的背景图像
- 在左上角显示背景图片且不重复
利润
- 设置边距
1 件事
到一个按钮
- 设置边距
2em
水平和1em
垂直于p
元素 - 为每边设置不同的边距值
p
元素
填充
- 设置 a 的顶部填充
按钮
元素到20像素
- 设置填充
32像素
在每一侧p
元素
边界
- 显示段落的虚线边框
- 设置上边框双,左边框虚线,右边框虚线和下边框实线
- 设置边框
3像素
, 加倍并将黄色变为 ap
元素 - 画一个半径为 5px 的圆
- 绘制一个半径为 10px、25px 的椭圆
文本
- 对齐 a 的文本
p
元素到中心 - 对齐 a 的文本
p
元素 - 仅对齐 a 中的最后一行文本
p
元素 - 将段落内的文本设置为全部大写
- 样式内的文本
h2
大写的元素 - 删除超链接元素的下划线
- 删除文本
- 在上划线和下划线中设置文本的某些单词的样式
- 间距为 0.5 的空间线
p
元素 - 空格词
20像素
分开在一个p
元素 - 显示一个
p
从右到左的元素 - 缩进 a 的第一行
p
元素到1 件事
- 显示阴影
.5rem
(水平和垂直)到文本
位置
- 将文本放置在图像的左上角
- 显示一些固定在页面特定位置的文本
- 在页面中显示一些粘性文本
溢出
- 隐藏溢出段落的滚动条
- 仅在溢出时显示段落的滚动条
高度宽度
- 设置宽度
p
元素为页面的 1/3。 - 将高度设置为
250像素
对于一个 div - 将最小宽度设置为
100像素
和最大宽度300像素
为一个p
元素
结论
我用一些问题整理了这个列表,但我想到了一些更高级的问题,所以 如果你想要第 2 部分,请告诉我 在评论中。
谢谢阅读!在本平台关注我,阅读更多编程内容。祝你有美好的一天,很快再见!
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明
本文链接:https://www.qanswer.top/23524/12161001
原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/288554.html