uniapp 在static/index.html中添加全局样式

这篇具有很好参考价值的文章主要介绍了uniapp 在static/index.html中添加全局样式。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

在static/index.html中添加全局样式

<style>
	div {
		background-color: #ccc;
	}
</style>

static/index.html源码:

<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		  <meta name="renderer" content="webkit">
		<title><%= htmlWebpackPlugin.options.title %></title>
    <link rel="shortcut icon" type="image/x-icon" href="<%= BASE_URL %>static/favicon.ico">
		<script>
			var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
			document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
		</script>
		<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
		<style>
			div {
				background-color: #ccc;
			}
		</style>
	</head>
	<body>
		<noscript>
			<strong>本站点必须要开启JavaScript才能运行.</strong>
		</noscript>
		<div id="app"></div>
</html>

编译后的源码:
uniapp 在static/index.html中添加全局样式,uniapp,uni-app文章来源地址https://www.toymoban.com/news/detail-822158.html

在static/index.html中添加全局样式的特点

  • 编译后的源码中,css未被加上了属性选择器
  • 对所有页面生效
  • 全局有效

到了这里,关于uniapp 在static/index.html中添加全局样式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uni-app 微信小程序全局配置分享好友、朋友圈...

    使用uni-app在实际项目中开发微信小程序,经常会遇到给项目添加分享给微信好友、朋友圈...功能,一般来说要将某个页面分享出去,就要在当前页面添加:  且onShareAppMessage()与onShareTimeline() 与methods同级!!! 官方网址:uniapp.dcloud.io/api/plugins… 这样做虽然实现了分享功能,

    2024年02月11日
    浏览(73)
  • 浅谈uni-app内置的一些基本组件和基本样式

    uni-app中内置了相当多的基础组件,类似html的div、p、b等标签作用,用来搭建页面的基础结构  uni-app内置的组件官网地址 https://uniapp.dcloud.io/component/view.html 属性说明 属性名 类型 默认值 说明 平台差异说明 selectable Boolean false 文本是否可选 App、H5、快手小程序 user-select Boolean

    2024年02月09日
    浏览(46)
  • uni-app小程序自定义checkbox,改样式改形状

    选中时的样式 未选择时的样式 颜色可以随意更改,形状原为方块,可以更改为圆形,以下是代码: #ec6330 为CheckBox颜色,可以自行更改。 元素使用的时候就是使用 round 和 red。例如: checkbox … class=“round red” html: JavaScript:

    2024年02月11日
    浏览(56)
  • #Uniapp:引入fonts&目录结构&全局样式&启动模式&全局变量

    uni-app 运行到微信开发者工具需要注意 小程序路径需要配置, 小程序端口需要开启 目录结构 开发规范 遵循vue和小程序混合 全局配置样式 全局 pages.json 局部的样式会覆盖全局的样式 https://uniapp.dcloud.net.cn/collocation/pages#style 可以单独设置h5的样式 tabBar tabBar 中的 list 是一个数

    2024年01月24日
    浏览(37)
  • uni-app编译成钉钉小程序,uViewUI组件样式失效,自定义组件样式失效

    公司项目需要把原本用 uinapp 开发的微信小程序想要在钉钉上也能使用,然后就打算用uniapp编译成钉钉小程序,看看是否有坑,不试不知道,一试吓一跳,官方没有提供钉钉的编译方式,按照网上文章的配置编译成钉钉小程序后,初步发现, uView-ui的icon没啦 ,然后样式和布局

    2024年02月11日
    浏览(55)
  • 在uni-app使用vue3进行store全局数据共享

    在uni-app中使用vue3进行store的全局数据共享,网上文章太杂了,记录一下自己写的一个最简单易懂的例子,以供自己后面需要用到时候可以最直观的知道到底怎么实现 在index.js中写入代码如下(示例): uni-app好像内置vuex,不需要额外下载,如果记错了的话就得先去下载好 代

    2024年02月09日
    浏览(85)
  • uni-app 分不清的全局变量this, uni, $u, vm, uni.$u, this.$u

     项目引入了uview,并将uview所有模块指给uniapp全局变量uni   uni.$u=$u  在登录页面,或者APP.vue打印以下变量: this, uni, $u, vm, uni.$u, this.$u 运行结果 $u     是uview挂载到uni上的,方便使用uni来操作uview组件。  uni.  对象是uni-app框架实例。 this.  在.vue页面,对应就是当前vue的实例

    2024年02月10日
    浏览(44)
  • uniapp全局拦截之uni.addInterceptor

    这个就很让人无语。。。。试了几次发现首次进入页面不拦截,准备做一个uniapp一进来判断授权的情况,但是这个只有第一次之后才会触发(因为我做的是微信公众号的H5页面的分享出去所以会需要首次进入拦截,如果对于首次登录拦截没有要求的可见最下边代码)。。分了两种

    2024年02月11日
    浏览(32)
  • 【uniapp微信小程序】如何将uni目录下static里的txt文件内容展示在页面上?

    uniapp框架中,可以通过使用vue的方式将static下的txt文件内容展示在页面上。 实现该功能需要先将 txt 文件放在 static 目录下,然后通过 uni-app 自带的 HTTP 请求方法将该文件的内容获取到,最后在页面上进行展示。 上述代码中,使用了 mounted 钩子函数,在组件渲染后触发 uni.r

    2024年02月12日
    浏览(35)
  • uni-app 实现图片上传添加水印操作

    改进原因: 1、Canvas 2D(新接口)需要显式设置画布宽高,默认:300 150,最大:1365 1365 ios 无法上传较大图片的尺寸,固对超过此尺寸的图片进行了等比缩放的处理; 2、在页面中设置canvas宽高,导致页面有滚动条;现在采用离屏的canvas,但是离屏的canvas,canvasToTempFilePath方法

    2024年02月07日
    浏览(94)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包