材质字体和HTML元素之间的对应关系

时间:2016-02-15 16:06:14

标签: html css fonts polymer paper-elements

我想弄清楚如何使用<?php use yii\helpers\Html; use yii\grid\GridView; /* @var $this yii\web\View */ /* @var $searchModel frontend\modules\salebills\models\BillsSearch */ /* @var $dataProvider yii\data\ActiveDataProvider */ $this->title = 'Bills'; $this->params['breadcrumbs'][] = $this->title; ?> <div class="bills-index"> <h1><?= Html::encode($this->title) ?></h1> <?php // echo $this->render('_search', ['model' => $searchModel]); ?> <!-- <p> <?= Html::a('Create Bills', ['create'], ['class' => 'btn btn-success']) ?> </p> --> <?= GridView::widget([ 'dataProvider' => $dataProvider, 'filterModel' => $searchModel, 'columns' => [ ['class' => 'yii\grid\SerialColumn'], //'billid', //'bills_ebillid', //'bills_year', //'console', 'billno', 'billdate', 'bills_partyname', 'billamount', 'billsPartyname.name_manager' // 'pdate1', // 'payment1', // 'details1', // 'pdate2', // 'payment2', // 'details2', // 'pdate3', // 'payment3', // 'details3', // 'pdate4', // 'payment4', // 'details4', // 'totalpayment', // 'bills_tc', // 'bills_tc_approval', // 'doctorsgift', // 'mrcommision', // 'mrname:ntext', // 'bills_other', // 'bills_specify_other:ntext', // 'bills_other_approval', // 'overdue', // 'cst', // 'wbst', // 'caseno', // 'amount', // 'discount', // 'tot', // 'surcharge', // 'total', // 'tax', // 'mrpvalue', // 'cstpercent', // 'wbstpercent', // 'surpercent', // 'totpercent', // 'transport', //['class' => 'yii\grid\ActionColumn'], ], ]); ?> </div> 。文档says

  

该组件提供了在应用程序中使用Material Design CSS样式的简单方法。可以使用以下导入:

     

...

     

paper-styles定义了几个mixins,例如:

  • typography.html
  • --paper-font-display4: {
  • --paper-font-display3: {
  • --paper-font-display2: {
  • --paper-font-display1: {
  • --paper-font-headline: {
  • --paper-font-title: {
  • --paper-font-subhead: {
  • --paper-font-body2: {

我的问题是:我应该使用哪些HTML元素?例如,--paper-font-body1: {似乎等同于font-display4,但我很困惑:是否存在某种对应关系?或者,我应该只使用h1吗?

注意:在纸质风格的Github页面中交叉询问as an issue

1 个答案:

答案 0 :(得分:0)

如果您只是尝试构建常规网站,请尝试使用Material Design Lite而不是Polymer。 getmdl.io