html & css
关注
分享
扫一扫
文章平均质量分 70
html和css的一些内容
楼兮诺
加油哦！
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
左侧固定右侧宽度自适应的布局方式
最近这段时间一直在面试，在自己的经历上、做的项目上扯得天花乱坠。谁曾想那天一个面试官突然问了我如何实现一个左侧宽度固定、右侧自适应的布局，一下自给我搞蒙了，因此特地来整理一下 废话不多说，简单的列举三种方法 方法一 左侧盒子浮动，右侧盒子使用margin-left实现 方法二 左侧盒子浮动，触发右侧盒子BFC的方式实现 方法三 使用flex布局实现 直接上代码 <style> div { box-sizing: border-box; } [cl.原创 2021-11-19 15:34:32 · 440 阅读 · 1 评论 -
css面试题-圣杯布局
圣杯布局网上的其他资料讲的已经非常清晰了，这里主要提供练习源码和实现过程及原理分析 一、圣杯布局是什么？ header和footer各自占领屏幕所有宽度，高度固定。 中间的container是一个三栏布局（左中右）。 三栏布局两侧宽度固定不变，中间部分自动填充整个区域（中间占满剩余宽度）。 以上内容引自 这里 二、圣杯布局的练习源码 2.1 完整初始源码 <!DOCTYPE html> <html> <head> <meta charset="UT.原创 2021-10-17 09:28:40 · 278 阅读 · 1 评论 -
css面试题-margin负值问题
先上结论 margin-top 和 margin-left 负值，元素向上、向左移动 margin-right负值，右侧元素左移，自身不受影响 margin-bottom负值，下方元素上移，自身不受影响 1.margin-top 为负值的情况 注意，我们操作的是下方的元素（item2） 从图片中可以看出，margin-top为负的时候，元素自身向上移动 2.margin-left 为负值的情况 注意，我们操作的是右侧的元素（item4） 从图片中可以看出，margin-left为负的时候，元素自身左移原创 2021-10-15 11:45:56 · 1336 阅读 · 0 评论