在标题的左侧实现FAB按钮并在其下方悬挂部分

时间:2016-04-27 19:42:34

标签: css material-design-lite

尝试在MDL中的标题左侧实现“添加”按钮。

可以在getmdl.io网站https://getmdl.io/templates/text-only/index.html

上看到一个示例

我定义了以下标题。

temp_data = [] # Its a list now
for x in range(1,11):
    if x == 3:
        temp_data.append({ "name" : "Cat" , "total" : data_value() }) # Use list.append()
    if x == 4:
        temp_data.append({ "name" : "Dog" , "total" : data_value()})
    if x == 5:
        temp_data.append({ "name" : "Chicken" , "total" : data_value()})        
print temp_data

此项目中不需要选项卡 - 但似乎无法将其放在标题下方,如链接示例中所示。

1 个答案:

答案 0 :(得分:1)

将以下CSS添加到链接到页面的样式表

.mdl-layout__header
{
    position: relative;
    overflow:visible;
}

.add-button{
    position: absolute;
    right: 10px;
    bottom: -25px;
}

然后将以下类添加到按钮

add-button