Home > Article > Web Front-end > ionic subtitle bar-subheader
ionic subtitle bar-subheader
- 黄舟Original
- 2017-02-17 13:40:301405browse
1. Example background
The title of ionic is bar-header, and the subtitle is bar-subheader
2. Implementation source code
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>ionic之副标题bar-subheader</title>
<link rel="stylesheet" href="../css/ionic.css" />
<script type="text/javascript" src="../js/ionic.bundle.js" ></script>
<script>
var app = angular.module("subheaderApp",["ionic"]);
app.controller("subheaderController",function($scope){
$scope.header = "标题";
$scope.subheader = "副标题";
});
</script>
</head>
<body ng-app="subheaderApp" ng-controller="subheaderController">
<p class="bar bar-header bar-assertive">
<label class="title">{{header}}</label>
</p>
<p class="bar bar-subheader bar-balanced">
<label class="title">{{subheader}}</label>
</p>
</body>
</html>3. Implementation result
The above is the content of ionic’s subtitle bar-subheader. For more related content, please pay attention to the PHP Chinese website (www.php.cn)!
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：The bottom bar-footer of ionicNext article：The bottom bar-footer of ionic