内容:.content和.scroll-content
ionic预定义了两个内容容器样式:
- .content - 流式定位,内容元素在文档流中按顺序定位
- .scroll-content - 绝对定位,内容元素占满整个屏幕
这两种样式都可以使用以下样式进一步确定位置及范围:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height"> <link rel="stylesheet" type="text/css" href="ionic.min.css"> </head> <body class="stable-bg"> <div class="bar bar-header"> <h1 class="title">.bar .bar-header</h1> </div> <div class="scroll-content has-header balanced-bg light"> <p>This is a demo!</p> <p>Can you see this line?</p> </div> <div class="bar bar-footer"> <h1 class="title">.bar .bar-footer</h1> </div> </body> </html>