摘要: 制作最上面的 注意图片和文字默认是基线对齐的,如果想要垂直居中对齐的话。那么需要添加vertical-align:middle的属性 body { width: 100%; min-width: 320px; max-width: 640px; /* body居中 */ margin: 0 auto 阅读全文
posted @ 2022-03-31 16:31 洛飞 阅读(58) 评论(0) 推荐(0) 编辑
摘要: 对于行内块(比如说图片)元素如果设置了text-align 和line-height 出现了不居中的情况下,因为图片和文字是基线对齐的。 如下图所示: 解决方案:我们需要设置图片的vertical-align属性,将这个属性设置为vertical-align:middle; 通过上边的例子,我们可以 阅读全文
posted @ 2022-03-31 16:21 洛飞 阅读(1512) 评论(0) 推荐(0) 编辑
摘要: body { width: 100%; min-width: 320px; max-width: 640px; /* body居中 */ margin: 0 auto; /* 移动端字体14px */ font-size:14px; /* 设置字体类型 */ font-family: -apple- 阅读全文
posted @ 2022-03-31 15:35 洛飞 阅读(59) 评论(0) 推荐(0) 编辑
摘要: ①初始化视口以及引入normalize.css文件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置 阅读全文
posted @ 2022-03-31 10:45 洛飞 阅读(197) 评论(0) 推荐(0) 编辑
摘要: 移动端布局和我们以前学习的PC端有所区别: 单独制作移动端页面(主流) 流式布局(百分比布局) flex弹性布局(强烈推荐) less+rem+媒体查询布局 混合布局 响应式页面兼容移动端(其次) 媒体查询 bootstrap 流式布局 流式布局,就是使用百分比布局,也称为非固定像素布局。 通过合资 阅读全文
posted @ 2022-03-31 10:23 洛飞 阅读(205) 评论(0) 推荐(0) 编辑