区块链技术博客
www.b2bchain.cn

自用前端实习面试知识点一

这篇文章主要介绍了自用前端实习面试知识点一的讲解,通过具体代码实例进行17948 讲解,并且分析了自用前端实习面试知识点一的详细步骤与相关技巧,需要的朋友可以参考下https://www.b2bchain.cn/?p=17948

本文实例讲述了2、树莓派设置连接WiFi,开启VNC等等的讲解。分享给大家供大家参考文章查询地址https://www.b2bchain.cn/7039.html。具体如下:

目录

  • css
    • 1.盒子模型
    • 2.如何画一条0.5px的线
    • 3.Flex布局
    • 4.BFC,用于清除浮动、防止margin重叠等
    • 5.垂直居中的方法
    • 6.块级元素、行内元素、行内块元素
    • 7.定位position
    • 8.浮动
    • 9.css选择器的优先级
    • 10.三栏布局

css

1.盒子模型

  1. 标准盒子模型:width指content部分的宽度
  2. IE盒子模型:width指content+border+padding的宽度

因此在计算盒子模型宽度的时候,标准盒子模型的宽度为width+左右padding+左右border,IE盒子模型的宽度为width。

在css3中引入了box-sizing属性,
box-sizing:content-box代表标准盒子,
box-sizing:border-box代表IE盒子。

2.如何画一条0.5px的线

理论上1px就是最小的了,这里有两种方法,
对于移动端,可以采用meta viewport的方式,缩放0.5倍。
viewport

<meta name="viewport" content="width=device-width, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5"/> 

或者可以采用transform:scale的方式。scale改变的不是元素本身的宽高,它改变的是x轴和y轴的缩放倍数,默认值是1。

transform: scale(0.5,0.5); 

3.Flex布局

Flex布局语法

利用flex实现圣杯布局

4.BFC,用于清除浮动、防止margin重叠等

BFC原理
块级格式化上下文,是一个独立的渲染区域,并且有一定的布局规则。

BFC区域不会与float box重叠。

BFC是页面上一个独立的容器,子元素不会影响到外面。

计算BFC的高度时,浮动元素也会参与计算。

哪些元素会生成BFC:
根元素;
浮动的元素;
固定定位或绝对定位的元素;
overflow不为visible的元素;
display为inline-block、table-cell、table-caption、flex、inline-flex的元素;

5.垂直居中的方法

  1. 对父元素设置display: flex; align-items: center;
  2. 对于有宽度的块级元素,设置margin: auto;
  3. 对于设置了绝对定位或固定定位的元素,方法二是不起作用的,这时要用margin负值法,top: 50%; margin-top: -元素的一半宽度;
  4. 宽度不确定时,设置transform: translateY(-50%);
  5. 父元素table布局,子元素设置vertical-align:center;

6.块级元素、行内元素、行内块元素

自用前端实习面试知识点一

7.定位position

定位

8.浮动

浮动

9.css选择器的优先级

自用前端实习面试知识点一

10.三栏布局

实现三栏布局的多种方式

本文转自互联网,侵权联系删除自用前端实习面试知识点一

赞(0) 打赏
部分文章转自网络,侵权联系删除b2bchain区块链学习技术社区 » 自用前端实习面试知识点一
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

b2b链

联系我们联系我们