1. 什么是uniapp？
uniapp是基于Vue.js开发的一款跨平台应用开发框架，可以同时开发小程序、H5、App等多个应用平台。uniapp提供了一套统一的API和组件库，可以大大简化开发流程，降低开发门槛，提高开发效率。
2. uniapp网页样式
2.1 网页样式的作用
在开发uniapp应用时，网页样式是非常重要的一部分。它可以让应用变得美观、易于使用，提高用户体验，从而增加用户的使用欲望和满意度。
2.2 uniapp网页样式的特点
uniapp中的网页样式与普通的网页开发有所不同。其中的css样式不能直接使用，需要使用uniapp提供的样式类。uniapp的样式类是一套基于flex布局的类库，可以轻松实现弹性布局，方便快捷的实现开发。
3. 去除uniapp网页样式
3.1 uni.css文件
在使用uniapp开发应用时，发现在每个页面中都有一个uni.css样式文件。这个文件是uniapp提供的默认样式文件，其中包含了uniapp中所有组件的默认样式，如按钮、图标、输入框等等。如果需要去除uniapp中的网页样式，需要将这个文件进行删除。
// 在index.html中删除uni.css样式文件
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="/static/css/app.css">
<!-- 删除uni.css文件 -->
<!-- <link rel="stylesheet" href="/static/css/uni.css"> -->
</head>
3.2 新建样式文件
在删除了uni.css文件之后，可以新建一个自定义的样式文件，将所有的网页样式都写在这个文件中。注意在写样式的时候，需要使用uniapp提供的样式类，否则可能会出现样式冲突或者样式无法正常生效的问题。
// 在static目录下新建一个custom.css文件
/* 此处省略了部分样式代码，详细的样式可以在uniapp官网中查看 */
/* 使用uniapp提供的样式类 */
/* 一些基础的样式类 */
.page { /* 页面容器 */
display: flex;
flex-direction: column;
min-height: 100vh;
background-color: #f8f8f8;
font-family: "PingFangSC-Regular", sans-serif;
}
.container { /* 容器 */
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.title { /* 标题 */
font-size: 36px;
font-weight: 500;
color: #333;
text-align: center;
}
.sub-title { /* 副标题 */
font-size: 24px;
font-weight: 500;
color: #666;
text-align: center;
}
/* 组件样式类 */
.icon { /* 图标 */
font-size: 36px;
color: #999;
}
.btn { /* 按钮 */
display: inline-block;
padding: 12px 20px;
background-color: #409eff;
color: #fff;
font-size: 16px;
border-radius: 5px;
}
.input { /* 输入框 */
border: 1px solid #ddd;
border-radius: 5px;
padding: 10px 15px;
font-size: 16px;
color: #333;
}
3.3 使用新的样式文件
新建完自定义的样式文件之后，需要将它引入到页面中。可以在index.html页面中加入如下代码：
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="/static/css/app.css">
<!-- 删除uni.css文件 -->
<!-- <link rel="stylesheet" href="/static/css/uni.css"> -->
<!-- 引入自定义样式文件 -->
<link rel="stylesheet" href="/static/css/custom.css">
</head>
这样就成功地去除了uniapp中的网页样式，然后自己编写的样式就可以在页面中正常显示了。
4. 总结
在开发uniapp应用时，网页样式是非常重要的一部分。学会如何去除uniapp中的网页样式，对开发优秀应用非常有意义。本文介绍了两种方法，分别是删除uni.css文件和新建自定义样式文件，可以根据自己的需要进行选择。