Home >Web Front-end >JS Tutorial >ionic style bar-light

ionic style bar-light

黄舟
黄舟Original
2017-02-17 14:08:131059browse

1、实例背景

     ionic头部可以利用bar-header,设置样式bar-light


2、实现源码

<!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-light</title>
		<link rel="stylesheet" href="../css/ionic.css" />
		<script type="text/javascript" src="../js/ionic.bundle.js" ></script>
		<script>
			var app = angular.module("tagApp",["ionic"]);
			app.controller("tagController",function($scope){
				$scope.username = "李海";
			});
		</script>
	</head>
	<body ng-app="barApp" ng-controller="barController">
		<p class="bar bar-header bar-light">
			<label class="title">查询</label>
		</p>
	</body>
</html>


3、实现结果

ionic style bar-light


 以上就是ionic之样式bar-light的内容,更多相关内容请关注PHP中文网(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:ionic style bar-stableNext article:ionic style bar-stable