Java高频面试专题合集解析：
当然在这还有更多整理总结的Java进阶学习笔记和面试题未展示，其中囊括了Dubbo、Redis、Netty、zookeeper、Spring cloud、分布式、高并发等架构资料和完整的Java架构学习进阶导图！
更多Java架构进阶资料展示
inherit——规定应该从父元素继承 z-index 属性的值。
Q14、什么是CSS Sprite（“精灵图”）
CSS Sprites叫 CSS精灵或者雪碧图，是一种网页图片应用处理方式。
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中。
再利用CSS的"background-image"，“background-repeat”，"background-position"的组合进行背景定位，background-position可以用数字精确的定位出背景图片的位置。
Q15、使用CSS Sprites的好处
利用CSS Sprites能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；
CSS Sprites能减少图片的字节，曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。
解决了网页设计师在图片命名上的困扰，只需对一张集合的图片上命名就可以了，不需要对每一个小元素进行命名，从而提高了网页的制作效率。
更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式，整个网页的风格就可以改变。维护起来更加方便。
Q16、CSS中的伪元素是什么？
CSS伪元素是添加到选择器的关键字，可用于设置所选元素的特定部分的样式。
“first-line” 伪元素用于向文本的首行设置特殊样式，只能用于块级元素！下面的属性可应用于 “first-line” 伪元素：font，color，background，word-space，letter-space，text-decoration，text-transform，line-height，clear。
“first-letter” 伪元素用于向文本的首字母设置特殊样式，只能用于块级元素！下面的属性可应用于 “first-letter” 伪元素：font，color，background，margin，padding，border，text-decoration，line-height，clear，text-transform。
Q17、如何设置h2和h3标签的相同样式？
通过用逗号（，）分隔符来定位多个元素
h2, h3 {
color: blue;
}
Q18、CSS中的float属性如何使用？
float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。
可能到值：
float: none;
float: left;
float: right;
Q19、当前版本的CSS中使用了哪些不同的模块？
CSS中有几个模块，部分如下：
选择器
盒模型
背景和边框
文字效果
2D / 3D转换
动画制作
多列布局
用户界面
Q20、CSS允许使用哪些不同的媒介类型？
@media属性主要有四种类型（包括screen）：
all—适用于所有设备。
print—打印预览模式/打印页面。
speech——适用于“朗读”页面的屏幕阅读器
screen——计算机屏幕（默认）
Q21. CSS有哪些单位
CSS 有两种类型的长度单位：相对和绝对。设置 CSS 长度的属性有 width, margin, padding, font-size, border-width, 等。
相对长度：
单位
描述
em
它是描述相对于应用在当前元素的字体尺寸，所以它也是相对长度单位。一般浏览器字体大小默认为16px，则2em == 32px；
rem
是根 em（root em）的缩写，rem作用于非根元素时，相对于根元素字体大小；rem作用于根元素字体大小时，相对于其出初始字体大小。
vh
viewpoint height，视窗高度，1vh=视窗高度的1%
vw
viewpoint width，视窗宽度，1vw=视窗宽度的1%
vmin
vw和vh中较小的那个。
vmax
vw和vh中较大的那个。
%
相对父元素
*提示: rem与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。
绝对长度
单位
描述
cm
厘米
mm
毫米
in
英寸 (1in = 96px = 2.54cm)
px *
像素 (1px = 1/96th of 1in)
pt
point，大约1/72英寸；(1pt = 1/72in)
*像素或许被认为是最好的"设备像素"，而这种像素长度和你在显示器上看到的文字屏幕像素无关。px实际上是一个按角度度量的单位。
Q22. 如何控制插入的图片不重复
.logo {
?
background-repeat: none;
?
}
Q23. 下面这段代码将对元素做些什么？
.container {
margin：0 auto;
}
在要应用的对象上指定margin：0 auto时候，该对象将位于其父容器的中央。第二个参数上会告诉浏览器自动确定左右边距，方法是将它们均等设置。它保证左右边距将设置为相同的大小。第一个参数0表示顶部和底部边距都将设置0。
Q24. overflow属性在CSS中被用于什么？
overflow 属性规定当内容溢出元素框时发生的事情。
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。
可能的值：
overflow: auto;如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
overflow: hidden;内容会被修剪，并且其余内容是不可见的。
overflow: scroll;内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
overflow: visible;默认值。内容不会被修剪，会呈现在元素框之外。
Q25. 用于控制图像滚动的属性是什么？
background-attachment：该属性设置背景图像是随页面其余部分滚动还是固定滚动。
body {
background-image: url(“img_tree.gif”);
background-repeat: no-repeat;
background-attachment: fixed;
}
Q26. 什么是响应式网页设计？
响应式网站设计是一种网络页面设计布局，其理念是：集中创建页面的图片排版大小，可以智能地根据用户行为以及使用的设备环境进行相对应的布局。
Q27.{visibility：hidden}和{display：none}有什么区别？
display:none 表示标签根本不会出现在页面上（尽管您仍然可以通过DOM与之交互）。与其他标签之间将没有分配空间。
visibility:hidden 表示该标签不可见，但在页面上为其分配了空间。标签已呈现，只是在页面上看不到。
Q28.CSS的特异性是什么意思？
如果有两条或两条以上指向同一元素的冲突 CSS 规则，则浏览器将遵循一些原则来确定哪一条是最具体的，并因此胜出。
将特异性（specificity）视为得分/等级，能够确定最终将哪些样式声明应用于元素。
每个选择器在特异性层次结构中都有其位置。以下四种类别定义了选择器的特异性级别：
1、行内样式 - 行内（内联）样式直接附加到要设置样式的元素。
2、ID - ID 是页面元素的唯一标识符，例如 #navbar。
3、类、属性和伪类 - 此类别包括 .classes、[attributes] 和伪类，例如：:hover、:focus 等。
4、元素和伪元素 - 此类别包括元素名称和伪元素，比如 h1、div、:before 和 :after。
Q29.CSS中字体相关的属性有哪些？
Font-style
Font-variant
Font-weight
Font-size/line-height
Font-family
Caption
Icon
Q30.如何在CSS中使用box-shadow？
box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。
box-shadow: h-shadow v-shadow blur spread color inset;
值
描述
h-shadow
必需。水平阴影的位置。允许负值。
v-shadow
必需。垂直阴影的位置。允许负值。
blur
可选。模糊距离。
spread
可选。阴影的尺寸。
color
可选。阴影的颜色。请参阅 CSS 颜色值。
inset
可选。将外部阴影 (outset) 改为内部阴影。
Q31.什么是派生选择器（上下文选择器）？
派生选择器允许你根据文档的上下文关系来确定某个标签的样式。通过合理地使用派生选择器，我们可以使 HTML 代码变得更加整洁。
Q32、什么是弹性布局？
flexbox布局正式称为CSS flexible box布局模块，是CSS3中的新布局模块。它可以改善容器中物品的对齐，方向和顺序，即使它们的尺寸是动态的，甚至是未知的。flex容器的主要特征是能够修改其子项的宽度或高度，以在不同的屏幕尺寸上以最佳方式填充可用空间。
采用Flex布局的元素，称为Flex容器（flex container），简称”容器”。它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称”项目”。
Q33、浏览器如何确定哪些元素与CSS选择器匹配？
浏览器从最右边（key 选择器）到左边匹配选择器。浏览器根据key选择器筛选出DOM中的元素，并遍历其父元素以确定匹配项。选择器链的长度越短，浏览器就可以更快地确定该元素是否与选择器匹配。
例如，使用选择器p span，浏览器首先找到所有元素，然后向上遍历其父元素直到根，以找到
元素。对于特定的，只要找到
，它就会知道匹配并且可以停止其匹配。
Q34、解释为什么选择有时候使用translate（）而不是绝对定位？
translate是CSS transform的值。更改变换或不透明度不会触发浏览器重排或重新绘制，但会触发合成。而更改绝对定位会触发回流。变换使浏览器为该元素创建一个GPU层，但是更改绝对定位属性将使用CPU。因此，translate（）效率更高，并且可以缩短绘制时间，从而使动画更流畅。
Q35、解释通过移动优先策略和自适应设计两种方法的差异？
这两种方法不是唯一的。使网站具有响应能力意味着某些元素将通过CSS媒体查询根据设备的屏幕尺寸（通常是视口宽度）来调整其大小或其他功能，从而做出响应。
例如，在较小的设备上减小字体大小。
@media (min-width: 601px) {
?
.my-class {
?
font-size: 24px;
?
}
@media (max-width: 600px) {
?
.my-class {
?
font-size: 12px;
?
}
?
}
移动优先策略也具有响应能力，但是，它同意我们应该默认并定义移动设备的所有样式，并且仅在以后向其他设备添加特定的响应规则。遵循前面的示例：
.my-class {
?
font-size: 12px;
?
}
?
@media (min-width: 600px) {
?
.my-class {
?
font-size: 24px;
?
}
?
}
移动优先策略具有两个主要优点：
1、由于不必针对任何媒体查询验证适用于它们的所有规则，因此在移动设备上的性能更高
2、它会强制针对响应式CSS规则编写更简洁的代码。
Q36、CSS如何实现元素的定位？
position属性指定用于元素的定位方法的类型。
有五个不同的位置值：
position: fixed;
position: static;
position: absolute;
position: sticky;
position: relative;
然后使用top，bottom，left和right属性定位元素。但是，除非首先设置position属性，否则这些属性将不起作用。根据位置值，它们的工作方式也不同。
Q37、什么是块级格式化上下文（BFC），如何工作？
1.规范解释
块格式化上下文（Block Formatting Context，BFC）是Web页面的可视化CSS渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素的交互限定区域。
2.通俗解释：
BFC 是一个独立的布局环境,可以理解为一个容器,在这个容器中按照一定规则进行物品摆放,并且不会影响其它环境中的物品。
如果一个元素符合触发BFC的条件，则该元素中的布局不受外部影响。
浮动元素会创建BFC，所以浮动元素内部子元素主要受浮动元素影响，两个浮动元素之间是互不影响的。
3.创建方式：
根元素或包含根元素的元素
浮动元素 float ＝ left | right 或 inherit（≠ none）
总结
其他的内容都可以按照路线图里面整理出来的知识点逐一去熟悉，学习，消化，不建议你去看书学习，最好是多看一些视频，把不懂地方反复看，学习了一节视频内容第二天一定要去复习，并总结成思维导图，形成树状知识网络结构，方便日后复习。
这里还有一份很不错的《Java基础核心总结笔记》，特意跟大家分享出来
目录：
部分内容截图：
境中的物品。
如果一个元素符合触发BFC的条件，则该元素中的布局不受外部影响。
浮动元素会创建BFC，所以浮动元素内部子元素主要受浮动元素影响，两个浮动元素之间是互不影响的。
3.创建方式：
根元素或包含根元素的元素
浮动元素 float ＝ left | right 或 inherit（≠ none）
总结
其他的内容都可以按照路线图里面整理出来的知识点逐一去熟悉，学习，消化，不建议你去看书学习，最好是多看一些视频，把不懂地方反复看，学习了一节视频内容第二天一定要去复习，并总结成思维导图，形成树状知识网络结构，方便日后复习。
这里还有一份很不错的《Java基础核心总结笔记》，特意跟大家分享出来
目录：
[外链图片转存中…(img-n4Te1fyl-1715262055743)]
部分内容截图：
[外链图片转存中…(img-WlzFpO47-1715262055743)]
[外链图片转存中…(img-WRxz0zqt-1715262055743)]
4031
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
