发表于： 2018-09-22 23:25:21
1 766
今天完成的事情：开始写任务十了、做完表格 做表单。天看看任务详解。开始任务十。
明天计划的事情：明天打算写完任务把旧的总结，在回顾一下。毕竟写了一两个礼拜。 以后需有功夫在看看用bootstrap3怎么写任务八九。加油努力，两个月看能不能搞完css。真的破了上海记录了。真的烦。
遇到的问题：昨天基本都在改样式 没遇到什么问题。最大的问题可能就是一开始这两边没有贴边。
是因为三件套container row col-12 三件套 最后一个觉得没必要。就没写。然后贴边了，后面加进去之后修改了半天代码。
收获：
为了更快速且友好 的支持移动设备开发，请使用 display classes来显示和隐藏组件，避免创建完全不同版本的一个网站（为移动网站建立一个独立的站点），而不是按照每种屏幕尺寸来隐藏元素。
隐藏元素只要使用 .d-none class或 .d-{sm,md,lg,xl}-none 的任何变量来支持响应式。
如要在指定的屏幕上显示一个元素，则可以将一个.d-*-none class 样式与 .d-*-* class样式结合起来，如 .d-none.d-md-block.d-xl-none 将隐藏除了中型、大型设备以外的所有屏幕中的元素，。
| 屏幕规格 | 引用样式 |
|---|---|
| 所有屏幕下隐藏 | .d-none |
| 只在xs屏幕上隐藏（即仅在手机屏幕上隐藏-其它规格屏幕正常显示-译者注） | .d-none .d-sm-block |
| 只在sm屏幕上隐藏（其它屏幕规格均显示） | .d-sm-none .d-md-block |
| 只在md屏幕时隐藏（其它屏幕规格均显示） | .d-md-none .d-lg-block |
| 只在lg屏幕时隐藏（其它屏幕规格均显示） | .d-lg-none .d-xl-block |
| 只在xl屏幕时隐藏（其它屏幕规格均显示） | .d-xl-none |
| 全部可见 | .d-block |
| 仅在xs屏幕时可见 | .d-block .d-sm-none |
| 仅在sm屏幕时可见 | .d-none .d-sm-block .d-md-none |
| 仅在md屏幕时可见 | .d-none .d-md-block .d-lg-none |
| 仅在lg屏幕时可见 | .d-none .d-lg-block .d-xl-none |
| 仅在xl屏幕时可见 | .d-none .d-xl-block |
返回列表
评论