美文网首页
H5学习之宠物网两种适配方式以及盒子模型简介

H5学习之宠物网两种适配方式以及盒子模型简介

作者: 张不二01 | 来源:发表于2017-01-19 09:52 被阅读37次
一,适配:

学习过程中遇到两种适配情况,

  • 1,一种是如下图,居中适配,这种适配用的是textalign居中适配的,

  • google.gif
  • 2,另外一种是下图,从左开始适配,这种情况下用过的是float:left适配,这种适配有一个注意点就是当你把一个标签的float属性设置为left或者right之后,它的父标签高度就没有了,然后就没有办法进行居中或者其他设置,调出父控件的高度的方式是设置父控件的display属性为inline-block

  • google01.gif
二,盒子模型
  • 1, 两种盒子模型

  • 图片 1.png
  • 图片 2.png
  • 2,书写格式:

  • 3.png

相关文章

  • H5学习之宠物网两种适配方式以及盒子模型简介

    一,适配: 学习过程中遇到两种适配情况, 1,一种是如下图,居中适配,这种适配用的是textalign居中适配的,...

  • 前端盒子模型学习

    内容概要 本文主要学习盒子模型,以及两种盒子模型有什么区别,如何使用,如何变化。 盒子模型 CSS中的盒子模型就是...

  • 面试题(DAT)

    1.什么是盒子模型?盒子模型有两种,标准盒子模型和IE盒子模型。标准盒子模型:width = content + ...

  • 【IMWeb秋招训练营】【Day1】面试题总结

    1.什么是盒子模型? 盒子模型有两种,标准盒子模型和IE盒子模型。 标准盒子模型:width = content ...

  • CSS之基础知识开篇(二)

    1.CSS盒模型 盒子模型有两种,分别是标准盒子模型和IE盒子模型。 CSS 把盒模型分为两种基本形态:Block...

  • css基础问题

    介绍css的盒子模型 css的盒子模型有两种:IE盒子模型,W3C盒子模型盒子模型:内容(content),内边距...

  • 关于CSS的盒模型知识点

    CSS分为两种盒模型:W3C标准盒子模型、IE盒子模型 两种盒模型的区别 1.W3C标准盒子模型:宽度 = 内容的...

  • 51 - 适配器模式

    本文再来学习一个结构型设计模式:适配器模式,本文主要介绍它的两种实现方式,类适配器和对象适配器,以及 5 种常见的...

  • 盒子模型、BFC、清除浮动

    盒子模型、BFC、浮动 盒子模型box model。盒子属性标准盒模型、IE盒模型的区别CSS如何设置这两种模型J...

  • 盒子模型.md

    盒子模型有两种IE盒子模型和标准盒子模型。盒子由内容,内边距,外边距,边框和外边距组成。 在标准盒子模型下,整个盒...

网友评论

      本文标题:H5学习之宠物网两种适配方式以及盒子模型简介

      本文链接:https://www.haomeiwen.com/subject/goxibttx.html