基于Python 优化 MUI标题栏
作者：衡辉 发布时间：2022-10-31 17:12:49
标签：Python,MUI,标题栏,优化
本文转自微信公众号："算法与编程之美"
一、前言
三步搭建MUI页面主框架法包括新建含mui的HTML文件、输入mheader（标题栏）、输入mbody（主体）。一个特色鲜明MUI界面无疑是能够吸引用户的关键之一，这利用css和JavaScript可以很快进行实现，但是同时对于初学者来说也是困难的，这就需要几个简单的小技巧实现页面美化。
二、问题描述
在将基本框架搭好以后，如何从一众手机界面中脱颖而出，如何简单快捷的实现页面美化成为一个必须思考的问题。下面小编将以带返回键的标题栏为例，为大家整理了几个优化小方法。
三、解决方案
在进行标题栏美化时只需要借助style中的background(背景颜色)、color(字体颜色)、font-family(字体样式)、font-size(字体大小)即可。下面是进行标题栏美化的具体操作步骤，除第一步以外其他的操作可随意调换顺序。
1. 创建一个带返回键标题栏
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1>算法与编程之美</h1></header>
2.更改标题栏的背景颜色
<headerclass="mui-barmui-bar-nav"style="background:yellowgreen;" >
<!直接使用style添加页面背景颜色>
3.更改标题栏的字体颜色
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: white;"></a>
<h1 style="color: white;" >算法与编程之美</h1><!style更改字体颜色以及字体>
4.更改标题栏的字体
<h1 style="color: white;font-family: '楷体';" >算法与编程之美</h1><!style更改字体颜色以及字体>
四、结语
在对标题栏进行样式设计以后，针对底部选项卡、段落、加载按钮等可以使用相同的方法进行字体和背景颜色的更改。当然这种简单的办法也只能做很小的改变，要真正将自己的软件界面格调提高，css和JavaScript的学习是必须进行的。
0
投稿猜你喜欢
最近接触一个项目，要在多个虚拟机中运行任务，参考别人之前项目的代码，采用了多进程来处理，于是上网查了查python中的多进程一、先说说Que- 一、concurrent模块的介绍concurrent.futures模块提供了高度封装的异步调用接口ThreadPoolExecutor：
- php遍历一个文件夹内的所有文件和文件夹，并删除所有文件夹和子文件夹下的所有文件的代码，通过递归方式实现达到清空一个目录的效果，代码简单实用
- 1.概述随着人工智能技术的不断发展，越来越多的AI产品被应用到各个领域，其中最具代表性的莫过于人工智能语言模型。语言模型是一种可以通过学习大
- 1.strip():str.strip([chars]);去除字符串前面和后面的所有设置的字符串，默认为空格chars -- 移除字符串头尾
- 1、Xmind用例编写规范1：需求大模块2：大模块中的小模块（需要根据需求来看需要多少层）3：用例等级和用例名称用例等级（转换成Excel文
- 跟传统的页面可以在每个页面分别设置填写对应的页面title,but,vue是单页面应用项目,想设置页面对应的title就不能跟传统方式一样了
- 作者认为最快的学习区块链的方式是自己创建一个，本文就跟随作者用Python来创建一个区块链。对数字货币的崛起感到新奇的我们，并且想知道其背后
- 导读本篇博客我们将全面了解 Flask 中关于请求的相关设置，开始前你需要先配置 Flask 的基础框架。from flask import
- str_split不支持中文，利用mb_xx函数实现个/** * Convert a string to an array * @param
- 可以说，互联网就是由一个个链接进行信息流通的。没有连接的网站如同一潭死水，毫无生气。当一个访客进入你的网站，在浏览的过程中，如果你的内容不引
- Reflect对象是一个全局的普通的对象。Reflect的原型就是Object.我们首先来验证下 看看Reflect的原型是否是Object
- 接触了Vue模块化开发才发现JavaScript组件化开发的演变一直在继续，以前也没有特别在意这一块内容，写着代码能调试运行不报错就可以了，
- Django是一个开放源代码的Web应用框架，由Python写成。采用了MTV的框架模式，即模型M，视图V和模版T。它最初是被开发来用于管理
- 前言wx.gird.Gird是实现类似excel表格的库，扩展面很广，本文讲述它添加按钮，按钮响应的内容实现效果图如下：本文基于wxPyth
- 效果图：代码如下：<!DOCTYPE html><html lang="en"><head
- 背景最近在用Electron开发一款应用，其中有涉及到检测因特网是否断开的需求。Electron基于Chromium和Node.js，让你可
- 本文实例为大家分享了Python密码强弱判断的具体代码，供大家参考，具体内容如下程序说明：通过获取用户输入，判断密码长度是否大于8，同时判断
- 当一个 .txt 文件的数据过于庞大，此时想要对数据进行排序就需要先将数据进行切割，然后通过归并排序，最终实现对整体数据的排序。要实现这个过
- 首先需要安装itchat库，可以pip install itchat安装，也可以在pycharm里安装# -*- coding:utf-8
