发表于: 2018-12-02 18:40:12

2 883


已完成:

      1. 调整了首页的代码,让其自适应更加好一点

      2. 完成了第二个页面


明日计划:

      1. 完成第三个页面


问题:

      1. 合作企业那里的内容不会跟随屏幕自适应竖排显示。


收获:

      1. 学会内联框架的使用

         (1)定义:iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。

         (2)属性:

          

属性描述
align
  • left
  • right
  • top
  • middle
  • bottom

不赞成使用。请使用样式代替。

规定如何根据周围的元素来对齐此框架。

frameborder
  • 1
  • 0
规定是否显示框架周围的边框。
height
  • pixels
  • %
规定 iframe 的高度。
longdescURL规定一个页面,该页面包含了有关 iframe 的较长描述。
marginheightpixels定义 iframe 的顶部和底部的边距。
marginwidthpixels定义 iframe 的左侧和右侧的边距。
nameframe_name规定 iframe 的名称。
sandbox
  • ""
  • allow-forms
  • allow-same-origin
  • allow-scripts
  • allow-top-navigation
启用一系列对 <iframe> 中内容的额外限制。
scrolling
  • yes
  • no
  • auto
规定是否在 iframe 中显示滚动条。
seamlessseamless规定 <iframe> 看上去像是包含文档的一部分。
srcURL规定在 iframe 中显示的文档的 URL。
srcdocHTML_code规定在 <iframe> 中显示的页面的 HTML 内容。
width
  • pixels
  • %
定义 iframe 的宽度。


      2. 对弹性盒布局有了更多的了解

         (1)定义:CSS3 弹性盒( Flexible Box 或 flexbox),是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。

         (2)常用属性:

属性描述
flex-direction指定弹性容器中子元素排列方式
flex-wrap设置弹性盒子的子元素超出父容器时是否换行
flex-flowflex-direction 和 flex-wrap 的简写
align-items设置弹性盒子元素在侧轴(纵轴)方向上的对齐方式
align-content修改 flex-wrap 属性的行为,类似 align-items, 但不是设置子元素对齐,而是设置行对齐
justify-content设置弹性盒子元素在主轴(横轴)方向上的对齐方式



返回列表 返回列表
评论

    分享到