- 博客(6)
- 收藏
- 关注
原创 前端学习之清除浮动(clear:both/overflow:hidden)
为什么要清除浮动?浮动本质是用来做一些文字混排效果的,但是被我们拿来做布局,则会有很多的问题出现,但是,你不能说浮动不好。由于浮动元素不再占用原文档流的位置(脱标),所以它会对后面的元素排版产生影响。为了解决这个问题,此时就需要在该元素中清除浮动。准确的说,并不是清除浮动,而是清除浮动后造成的影响。如果浮动一开始就是一个美丽的错误,那么请用正确的方式拯救它~清除浮动的本质清除浮动主...
2020-04-19 16:40:11 1143
原创 前端学习之基础细碎笔记(盒子居中、外边距合并/塌陷等)
外边距实现居中对齐让一个盒子实现水平居中,需要满足以下两个条件:必须是块级元素盒子必须指定宽度(width)然后给左右的外边距都设置为auto,就可以使盒子水平居中。实际工作中经常使用这种方式进行网页布局,示例代码如下:.inner{ width: 1200px;margin:0 auto;}文字盒子水平居中的区别text-align: center;/* 文字水平居中 */...
2020-04-12 20:20:23 175
原创 前端学习之版心和布局流程
什么是版心?“版心”(可视区)是指网页中主体内容所在的区域。一般在浏览器窗口水平居中显示,常见的宽度值为960px、980px、1000px、1200px等。布局流程为了提高网页制作的效率,布局时通常需要遵守一定的布局流程。具体如下:确定页面的版心(可视区)分析页面的行模块,以及每个行模块中的列模块。制作html结构css初始化,然后开始运用盒子模型的原理,通过DIV+CSS布局来...
2020-04-09 21:15:51 8273 2
原创 前端学习之浮动初识
首先了解css定位机制:普通流/标准流(normal flow)网页内标签元素正常从上到下,从左到右的排序的意思。比如块级元素会独占一行,行内元素会按顺序依次前后排列;按照这种大前提的布局排列之下绝对不会出现例外的情况叫做普通布局。 规规矩矩,一般不会出现意外浮动(float)浮动最早是用来控制图片的,以便达到其他元素(特别是文字)实现“环绕”图片的效果。后来,我们发现浮动有个很有意思...
2020-04-06 22:30:20 365
原创 前端学习笔记之盒子阴影
前端学习笔记之盒子阴影盒子阴影–box-shadow前两个属性是必须写的,其余的可以省略。语法格式box-shadow: 水平阴影 垂直阴影 模糊距离 阴影尺寸 阴影颜色 内/外阴影;值描述h-shadow必需。水平阴影的位置。允许负值。v-shadow必需。垂直阴影的位置。允许负值。blur可选。模糊距离。spread可选。阴影的尺寸。...
2020-04-06 18:29:02 908
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人