一、块级元素与行内元素的区别?
1. 块级独占一行的,行内与其他元素共享一行
2.块级元素可以直接设置宽高,行内不能直接设置宽高,需要结合CSS的display来设置。
3.块级元素可以嵌套块级与行内元素,而行内只能包含行内元素。
二、清除浮动 100%
父子级:
1.在子级元素后添加一个空元素,为其添加clear:both 弊端:增加了无意义的元素结构
2.给父级元素设置一个overflow:hiddden 解决了第一种方法的弊端
3. .hidden::after 为需要清除浮动元素的伪对象中设置height:0,
#layout::after{
display:block;
clear:both;
content:"";
} (用伪类清除浮动时用after,并且加上content:""可以加内容也可以不加,但是一定要加上display:block;,同时还要写clear:both;)
【最推荐使用第二种】
<div></div>
<div></div>
兄弟级:
给当前元素(被浮动影响的元素)设置css属性clear,值可为left、right,both。作用分别为清除左浮动元素带来的影响,清除右浮动元素带来的影响,清除左右两侧浮动元素带来的影响。
三、常见系统的区别?
Linux内核
windows MAC 桌面级系统
四、布局原则:
1.框架搭建:自上而下,由外向内
2.通配符选择器重置全局样式:
*{
margin:0,
padding:0
}
a{
text-decoration: none;
color: inherit;
}
3.由外向内布局,每一块元素依然遵循自上而下,由外至内的原则
五、 水平垂直居中问题:
1.margin移动 top、left
2.父相对定位+子绝对定位,绝对定位top、left为50%,其余使用margin-left和margin-top移动
3.父相对+子绝对,且left、top、bottom、right为0,margin:auto
4.给父元素设置display:flex,且align-items:center;justify-content:center;
六、算法题 求101到200之间的素数。
代码:
for(var i=2 ; i<100 ; i++){
var a = true;
for(var j = 2; j < i; j++){
//判断i能否被j整除
if(i%j == 0){
//能被整除则说明不是素数,修改布尔值为false
a = false ;
}
}
//打印素数
if(a){
console.log(i);
}
}
七、算法题 求水仙花数(水仙花数为其每个位上的数的其长度乘方之和等于自身值,则其为水仙花数,如407=4*4*4+0*0*0+7*7*7)
代码:for(var i=100;i<=999;i++){
var a=parseInt(i/100)
var b=parseInt(i%100/10)
var c=parseInt(i%10)
if(a*a*a+b*b*b+c*c*c==i){
console.log(i)
}
}
八、算法题1 2 3 4四位数组成不重复三位数
var sum=0;
var count=0;
for(var a=1;a<=4;a++){
for(var b=1;b<=4;b++){
for(var c=1;c<=4;c++){
sum=a*100+b*10+c;
if(a!=b&&c!==b&&a!==c){
console.log(sum);
count++;
}
}
}
}