当前位置 博文首页 > 大曾blog:DaZeng:Axure实现bootstrap首页线框图

    大曾blog:DaZeng:Axure实现bootstrap首页线框图

    作者:[db:作者] 时间:2021-08-03 15:41

    W240第二天——bootstrap线框图

    Axure的简单使用:

    bootstrap导航栏

    • 详情设计见导航栏

    bootstrap首页banner

    在这里插入图片描述

    在这里插入图片描述

    注:

    • 谷歌浏览器最小字号12像素
    • 按钮、链接等需额外矩形框进行框选住
      在这里插入图片描述

    bootstrap元件列表

    在这里插入图片描述

    在这里插入图片描述
    注:

    • 注意右下角概要页面中进行组合打包
      在这里插入图片描述

    在这里插入图片描述
    打包选中时,按住shift选中第一个和最后一个自动选中中间所有。

    • 母版的创建和使用:
      在这里插入图片描述
      在这里插入图片描述
      双击右下角母版元件可进行统一编辑,模板改变所有模板改变,创建母版后按住ctrl鼠标左键拖动创建其他母版。
    • 排版:
      在这里插入图片描述
      第一个和最后一个元素固定位置后中间自动水平分布。

    bootstrap底部

    在这里插入图片描述

    在这里插入图片描述
    注:

    • 底部动态面板设置高度h:2,背景色黑色,100%宽度,形成底部铺满宽度的水平线。
      在这里插入图片描述

    整体效果

    在这里插入图片描述

    cs