uniapp如何引入官方的css样式库

千次阅读 2020-02-25 13:50:36

uniapp引入css样式、图标库、动画库 uniapp如何引入官方的css样式库 ...2.将样式库的css或者js复制到common文件夹 3.在App.vue中引入需要的样式库 <script> export default { onLaunch: function() { co...

uniapp引入css样式、图标库、动画库
uniapp如何引入官方的css样式库
1.项目目录新建一个common的文件夹
common一般存放的是项目引入的一个css和js样式库

2.将样式库的css或者js复制到common文件夹
3.在App.vue中引入需要的样式库
<script>
export default {
	onLaunch: function() {
		console.log('App Launch');
	},
	onShow: function() {
		console.log('App Show');
	},
	onHide: function() {
		console.log('App Hide');
	}
};
</script>

<style>
/*每个页面公共css */
/* 引入hello模板公共样式库 */
@import './common/uni.css';
/* 引入animate动画库 */
@import './common/animate.css';
/* 引入图标 */
@import './common/icon.css';
</style>

4.注意事项
如果引入的是hello模板里面的uni.css样式库，则还需要拷贝static文件夹下的后缀名为.ttf的文件
相应创建一个static文件夹，将文件放置到文件夹中，否则启动项目会报错。
原因：uni.css中引入了uni.ttf
@font-face {
	font-family: uniicons;
	font-weight: normal;
	font-style: normal;
	src: url('~@/static/uni.ttf') format('truetype');
}

uniapp如何引入的css图标库
1.进入https://www.iconfont.cn/阿里巴巴矢量图标库
2.如何下载图标
选择你要使用的图标，点击购物车，加入完成后点击右上角购物车按钮，然后进入点击添加至项目
取一个项目名然后进去之后会默认选择unicode，选择右边的下载至本地，然后下载过后解压文件
里面有个iconfont.css文件拷贝到项目文件common文件夹中
App.vue中@import './common/iconfont.css';

3.如何使用图标
解压的压缩包中有一个html文件，将html文件打开，里面有显示的图标，F12审查元素
选择你要使用的图标，点击它，在底部查看他的类名，复制他的类名到项目标签中，即可使用。

uniapp如何引入的css动画库
1.进入https://daneden.github.io/animate.css/
2.点击下方的下载
3.下载好之后右键另存为animate.css将其复制到common文件夹中
4.在App.vue中引入（同上）
5.在class类名中添加相应的类名就可以引入相关的动画

收起

展开全文

jQuery库的简单使用:jQuery中的 DOM 操作,增删改查,复制,替换,包裹,属性和样式操作

2020-10-23 12:51:40

jQuery中的 DOM 操作查查找属性节点: 通过 jQuery 选择器完成. 操作属性节点: 查找到所需要的元素之后, 可以调用 jQuery 对象的 attr() 方法来获取它的各种属性值操作文本节点：通过 text() 方法增创建节点: ...

jQuery中的 DOM 操作
查
查找属性节点: 通过 jQuery 选择器完成.
操作属性节点: 查找到所需要的元素之后, 可以调用 jQuery 对象的 attr() 方法来获取它的各种属性值
操作文本节点：通过 text() 方法

增
创建节点: 
使用 jQuery 的工厂函数 $(): $(html); 
会根据传入的 html 标记字符串创建一个 DOM 对象, 
并把这个 DOM 对象包装成一个 jQuery 对象返回.
注意: 
动态创建的新元素节点不会被自动添加到文档中, 而是需要使用其他方法将其插入到文档中; 
当创建单个元素时, 需注意闭合标签和使用标准的 XHTML 格式. 
例如创建一个<p>元素, 可以使用 $(“<p/>”) 或 $(“<p></p>”), 
但不能使用 $(“<p>”) 或 $(“<P>”)
创建文本节点就是在创建元素节点时直接把文本内容写出来; 
创建属性节点也是在创建元素节点时一起创建

改



删
remove(): 
从 DOM 中删除所有匹配的元素, 传入的参数用于根据 jQuery 表达式来筛选元素. 
当某个节点用 remove() 方法删除后, 该节点所包含的所有后代节点将被同时删除. 
这个方法的返回值是一个指向已被删除的节点的引用.
empty(): 清空节点 – 清空元素中的所有后代节点(不包含属性节点).

练习
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
	//需求: 点击 submit 按钮时,　检查是否选择 type, 若没有选择给出提示: "请选择类型"; 
	//     检查文本框中是否有输入(可以去除前后空格), 若没有输入,则给出提示: "请输入内容";
	//若检查都通过, 则在相应的 ul 节点中添加对应的 li 节点 
	//需求2: 使包括新增的 li 都能响应 onclick 事件: 弹出 li 的文本值. 
	$(function() {

		function showContent(li) {
			alert($(li).text());
		}
		$("li").click(function() {
			showContent(this);
		});

		//1. 同 JS 的响应函数一样, jQuery 对象的响应函数若返回 false, 
		//可以取消指定元素的默认行为. 比如 submit, a 等
		//2. val() 方法, 相当于 attr("value"), 获取表单元素的 value 属性值. 
		//3. $.trim(str): 可以去除 str 的前后空格.
		//4. jQuery 对象的方法的连缀: 调用一个方法的返回值还是调用的对象, 于是可以
		//在调用方法的后面依然调用先前的那个对象的其他方法. 
		$(":submit").click(
				function() {

					var $type = $(":radio[name='type']:checked");
					if ($type.length == 0) {
						alert("请选择类型.");
						return false;
					}
					var type = $type.val();
					var $name = $(":text[name='name']");
					var name = $name.val();
					//$.trim(str): 可以去除 str 的前后空格.
					name = $.trim(name);
					$name.val(name);
					if (name == "") {
						alert("请输入内容");
						return false;
					}
					$("<li>" + name + "</li>").appendTo($("#" + type)).click(
							function() {
								showContent(this);
							});
					//取消 submit 的默认行为
					return false;
				});
	})
</script>
</head>
<body>
	<p>你喜欢哪个城市?</p>
	<ul id="city">
		<li id="bj">北京</li>
		<li>上海</li>
		<li>东京</li>
		<li>首尔</li>
	</ul>
	<br>
	<br>
	<p>你喜欢哪款单机游戏?</p>
	<ul id="game">
		<li id="rl">红警</li>
		<li>实况</li>
		<li>极品飞车</li>
		<li>魔兽</li>
	</ul>
	<br>
	<br>
	<form action="dom-7.html" name="myform">

		<input type="radio" name="type" value="city">城市 <input
			type="radio" name="type" value="game">游戏 name: <input
			type="text" name="name" /> <input type="submit" value="Submit"
			id="submit" />
	</form>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
 $(function(){
	 //1. jQuery 对象调用 jQuery 提供的方法的返回值如果是一个对象的话
	 //那么这个对象一定是一个 jQuery 对象
	 //2. find() 方法: 查找子节点, 返回值为子节点对应的 jQuery 对象
	 function removeTr(aNoe){
		 //获取 a 节点所在的的 tr 节点. 返回时是 jQuery 对象
		 var $trNode = $(aNoe).parent().parent();
		 var textContent = $trNode.find("td:first").text();
		 textContent = $.trim(textContent);
		 var flag = confirm("确定要删除" + textContent + "的信息吗?");
		 if(flag){
			 $trNode.remove();
		 }
		 return false;
	 }
	 $("#employeetable a").click(function(){
		 return removeTr(this);
	 });
	 $("#addEmpButton").click(function(){
		 $("<tr></tr>").append("<td>" + $("#name").val() + "</td>")
		               .append("<td>" + $("#email").val() + "</td>")
		               .append("<td>" + $("#salary").val() + "</td>")
		               .append("<td><a href='deleteEmp?id=xxx'>Delete</a></td>")
		               .appendTo("#employeetable tbody")
		               .find("a")
			               .click(function(){
			            	   return removeTr(this)
			               });
	 });
 })
</script>
</head>
<body>
	<center>
		<br> <br> 添加新员工 <br> <br> name: <input type="text"
			name="name" id="name" />&nbsp;&nbsp; email: <input type="text"
			name="email" id="email" />&nbsp;&nbsp; salary: <input type="text"
			name="salary" id="salary" /> <br> <br>
		<button id="addEmpButton" value="abc">Submit</button>
		<br> <br>
		<hr>
		<br> <br>
		<table id="employeetable" border="1" cellpadding="5" cellspacing=0>
			<tbody>
				<tr>
					<th>Name</th>
					<th>Email</th>
					<th>Salary</th>
					<th>&nbsp;</th>
				</tr>
				<tr>
					<td>Tom</td>
					<td>tom@tom.com</td>
					<td>5000</td>
					<td><a href="deleteEmp?id=001">Delete</a></td>
				</tr>
				<tr>
					<td>
						Jerry
					</td>
					<td>jerry@sohu.com</td>
					<td>8000</td>
					<td><a href="deleteEmp?id=002">Delete</a></td>
				</tr>
				<tr>
					<td>Bob</td>
					<td>bob@tom.com</td>
					<td>10000</td>
					<td><a href="deleteEmp?id=003">Delete</a></td>
				</tr>
			</tbody>
		</table>
	</center>
</body>
</html>

复制和替换
clone(): 克隆匹配的 DOM 元素, 返回值为克隆后的副本. 但此时复制的新节点不具有任何行为.
clone(true): 复制元素的同时也复制元素中的的事件 
注意:
//复制 #bj 节点, 并添加到 #rl 节点的后面
	/*
	1. clone 节点时需要注意克隆后的节点的 id 属性. 若原节点有 id
	属性, 则克隆后, 会出现在一个文档中有两个 id 相同的节点的情况.
	2. clone(true): 在克隆节点的同时, 克隆节点包含的事件. 
	*/
	$("#bj").clone(true)
	        .attr("id", "bj2")
	        .insertAfter($("#rl"));

replaceWith(): 将所有匹配的元素都替换为指定的 HTML 或 DOM 元素
replaceAll(): 颠倒了的 replaceWith() 方法.
注意: 若在替换之前, 已经在元素上绑定了事件, 替换后原先绑定的事件会与原先的元素一起消失
以上的两个方法还有移动节点的功能
节点互换需要先克隆节点.

这是用bj2来替换rl,返回的是被替换的节点的引用就是rl节点的引用
var $rl = $("#rl").replaceWith($bj2);

包裹节点
wrap(): 将指定节点用其他标记包裹起来. 
	该方法对于需要在文档中插入额外的结构化标记非常有用, 而且不会破坏原始文档的语义.
wrapAll(): 将所有匹配的元素用一个元素来包裹. 
	而 wrap() 方法是将所有的元素进行单独包裹.
wrapInner(): 将每一个匹配的元素的子内容(包括文本节点)用其他结构化标记包裹起来.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
	//测试使用 jQuery wrap, wrapAll, wrapInner
	$(function() {
		//包装 li 本身
		$("#game li").wrap("<font color='red'></font>");
		//包装所有的 li
		$("#city li").wrapAll("<font color='red'></font>");
		//包装 li 里边的文字. 
		$("#language li").wrapInner("<font color='red'></font>");
	})
</script>
</head>
<body>
	<p>你喜欢哪个城市?</p>
	<ul id="city">
		<li id="bj" name="BeiJing">北京</li>
		<li>上海</li>
		<li id="dj">东京</li>
		<li id="se">首尔</li>
	</ul>

	<br>
	<br>
	<p>你喜欢哪款单机游戏?</p>
	<ul id="game">
		<li id="rl">红警</li>
		<li>实况</li>
		<li>极品飞车</li>
		<li>魔兽</li>
	</ul>
	<br>
	<br>
	<p>你喜欢哪种开发语言?</p>
	<ul id="language">
		<li>C</li>
		<li>Java</li>
		<li>.NET</li>
		<li>PHP</li>
	</ul>
	<br>
	<br> gender:
	<input type="radio" name="gender" value="male" />Male
	<input type="radio" name="gender" value="female" />Female
	<br>
	<br> name:
	<input type="text" name="username" value="atguigu" />
</body>
</html>

属性操作
attr(): 获取属性和设置属性
当为该方法传递一个参数时, 即为某元素的获取指定属性
当为该方法传递两个参数时, 即为某元素设置指定属性的值
jQuery 中有很多方法都是一个函数实现获取和设置.
	 如: attr(), html(), text(), val(), height(), width(), css() 等.
removeAttr(): 删除指定元素的指定属性

读取和设置某个元素中的 HTML 内容: html() . 
	该方法可以用于 XHTML, 但不能用于 XML 文档
读取和设置某个元素中的文本内容: text(). 
	该方法既可以用于 XHTML 也可以用于 XML 文档.
读取和设置某个元素中的值: val() --- 
	该方法类似 JavaScript 中的 value 属性. 对于文本框, 下拉列表框, 
	单选框该方法可返回元素的值(多选框只能返回第一个值).
	如果为多选下拉列表框, 则返回一个包含所有选择值的数组

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Untitled Document</title>
		<script type="text/javascript" src="jquery-1.7.2.js"></script>
		<script type="text/javascript">
			$(function(){
				//1. 为 #address 添加 focus(获取焦点), blur(失去焦点) 响应函数
				$(":text").focus(function(){
					//2. 当获取焦点时, 若 #address 中是默认值
					//(defaultValue 属性, 该属性是 DOM 对象的属性), 就使其值置为 ""
					var val = $(this).val();
					if(val == this.defaultValue){
						$(this).val("");
					}
				}).blur(function(){
					//3. 失去焦点是, 若 #address 的值在去除前后空格后等于 ""
					//则为其恢复默认值. 
					var val = this.value;	
					if($.trim(val) == ""){
						this.value = this.defaultValue;
					}
				});
				
				//2. 
				$(":button:eq(1)").click(function(){
					$("#single").val("选择3号");
				});
				
				$(":button:eq(2)").click(function(){
					$("#multiple").val(["选择2号", "选择4号"]);				
				});
								
				$(":button:eq(3)").click(function(){
					$(":checkbox[name='c']").val(["check2", "check4"]);
				});
				
				$(":button:eq(4)").click(function(){
					//即便是为一组 radio 赋值, val 参数中也应该使用数组. 
					//使用一个值不起作用。 
					$(":radio[name='r']").val(["radio2"]);
				});
				$(":button:eq(5)").click(function(){
					//val() 可以直接获取 select 的被选择的值. 
					alert($("#single").val());
					alert($("#multiple").val());
					//val 不能直接获取 checkbox 被选择的值
					//若直接获取, 只能得到第一个被选择的值. 
					//因为 $(":checkbox[name='c']:checked") 得到的是一个
					//数组. 而使用 val() 方法只能获取数组元素的第一个值
					//若希望打印被选择的所有制, 需要使用 each 遍历. 
					//alert($(":checkbox[name='c']:checked").val());
					$(":checkbox[name='c']:checked").each(function(){
						alert(this.value);
					});
					//而 raido 被选择的只有一个, 所以可以直接使用 val() 方法. 
					alert($(":radio[name='r']:checked").val());
				});
			})
		</script>
	</head>
	<body>
		<input type="text" id="address" value="请输入邮箱地址"><br>
		<input type="text" id="password" value="请输入邮箱密码"><br>
		<input type="button" value="登录">
		<br><br><br>
		<input type="button" value="使单选下拉框的'选择3号'被选中"/>
		<input type="button" value="使多选下拉框选中的'选择2号'和'选择4号'被选中"/><br>
		<input type="button" value="使多选框的'多选2'和'多选4'被选中"/>
		<input type="button" value="使单选框的'单选2'被选中"/><br>
		<input type="button" value="打印已经被选中的值"><br>
		<br/>
		<select id="single">
		  <option>选择1号</option>
		  <option>选择2号</option>
		  <option>选择3号</option>
		</select>
		<select id="multiple" multiple="multiple" style="height:120px;">
		  <option selected="selected">选择1号</option>
		  <option>选择2号</option>
		  <option>选择3号</option>
		  <option>选择4号</option>
		  <option selected="selected">选择5号</option>
		</select>
		<br/><br/>
		<input type="checkbox" name="c" value="check1"/> 多选1
		<input type="checkbox" name="c" value="check2"/> 多选2
		<input type="checkbox" name="c" value="check3"/> 多选3
		<input type="checkbox" name="c" value="check4"/> 多选4
		<br/>
		<input type="radio" name="r" value="radio1"/> 单选1
		<input type="radio" name="r"  value="radio2"/> 单选2
		<input type="radio" name="r"  value="radio3"/> 单选3
	</body>
</html>

样式操作
获取 class 和设置 class : class 是元素的一个属性, 
所以获取 class 和设置 class 都可以使用 attr() 方法来完成.
追加样式: addClass() 
移除样式: removeClass() --- 从匹配的元素中删除全部或指定的 class
切换样式: toggleClass()  --- 控制样式上的重复切换.如果类名存在则删除它, 
							如果类名不存在则添加它.
判断是否含有某个样式: hasClass() --- 判断元素中是否含有某个 class, 
							如果有, 则返回 true; 否则返回 false

获取和设置元素的样式属性: css()
获取和设置元素透明度: opacity 属性
获取和设置元素高度, 宽度: height(), width(). 在设置值时, 
	若只传递数字, 则默认单位是 px. 如需要使用其他单位则需传递一个字符串, 
	例如 $(“p:first”).height(“2em”);
获取元素在当前视窗中的相对位移: offset(). 
	其返回对象包含了两个属性: top, left. 该方法只对可见元素有效

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 12px;
	text-align: center;
}

a {
	color: #04D;
	text-decoration: none;
}

a:hover {
	color: #F50;
	text-decoration: underline;
}

.SubCategoryBox {
	width: 600px;
	margin: 0 auto;
	text-align: center;
	margin-top: 40px;
}

.SubCategoryBox ul {
	list-style: none;
}

.SubCategoryBox ul li {
	display: block;
	float: left;
	width: 200px;
	line-height: 20px;
}

.showmore {
	clear: both;
	text-align: center;
	padding-top: 10px;
}

.showmore a {
	display: block;
	width: 120px;
	margin: 0 auto;
	line-height: 24px;
	border: 1px solid #AAA;
}

.showmore a span {
	padding-left: 15px;
	background: url(img/down.gif) no-repeat 0 0;
}

.promoted a {
	color: #F50;
}
</style>
<script type="text/javascript" src="scripts/jquery-1.3.1.js"></script>
<script type="text/javascript">
	$(function() {

		//测试 jQuery 样式相关的方法. 

		//1. hasClass(): 某元素是否有指定的样式
		alert($("div:first").hasClass("SubCategoryBox")); //true

		//2. 移除样式
		$("div:first").removeClass("SubCategoryBox");

		alert($("div:first").hasClass("SubCategoryBox"));

		//3. 添加样式
		$("div:first").addClass("SubCategoryBox");

		//4. 切换样式: 存在, 则去除; 没有, 则添加. 
		$(".showmore").click(function() {
			$("div:first").toggleClass("SubCategoryBox");
			return false;
		});

		//5. 获取和设置元素透明度: opacity 属性
		alert($("div:first").css("opacity"));

		$("div:first").css("opacity", 0.5);

		//6. width 和 height
		alert($("div:first").width());
		alert($("div:first").height());

		$("div:first").width(400);
		$("div:first").height(80);

		//7. 获取元素在当前视窗中的相对位移: offset(). 
		//其返回对象包含了两个属性: top, left. 该方法只对可见元素有效
		alert($("div:first").offset().top);
		alert($("div:first").offset().left);

	});
</script>
</head>
<body>
	<div class="SubCategoryBox">
		<ul>
			<li><a href="#">佳能</a><i>(30440) </i></li>
			<li><a href="#">索尼</a><i>(27220) </i></li>
			<li><a href="#">三星</a><i>(20808) </i></li>
			<li><a href="#">尼康</a><i>(17821) </i></li>
			<li><a href="#">松下</a><i>(12289) </i></li>
			<li><a href="#">卡西欧</a><i>(8242) </i></li>
			<li><a href="#">富士</a><i>(14894) </i></li>
			<li><a href="#">柯达</a><i>(9520) </i></li>
			<li><a href="#">宾得</a><i>(2195) </i></li>
			<li><a href="#">理光</a><i>(4114) </i></li>
			<li><a href="#">奥林巴斯</a><i>(12205) </i></li>
			<li><a href="#">明基</a><i>(1466) </i></li>
			<li><a href="#">爱国者</a><i>(3091) </i></li>
			<li><a href="#">其它品牌相机</a><i>(7275) </i></li>
		</ul>
		<div class="showmore">
			<a href="more.html"><span>显示全部品牌</span></a>
		</div>
	</div>
</body>
</html>

收起

展开全文

解决 Vue 项目中使用 iView 组件库设置样式不生效的问题

千次阅读 2019-05-21 07:03:56

找到要设置样式的类名，直接按照下面写法设置就可以了！ <style lang="less" scoped> @deep: ~'>>>'; @{deep}.ivu-transfer-operation { visibility: hidden !important; } </style> 复制代码...

找到要设置样式的类名，直接按照下面写法设置就可以了！
<style lang="less" scoped>
@deep: ~'>>>';
@{deep}.ivu-transfer-operation {
    visibility: hidden !important;
}
</style>
复制代码
转载于:https://juejin.im/post/5ce3a29f6fb9a07eff005cdf

收起

展开全文

uni-app引入官方的css样式库、高效开发技巧（包括Iconfont 操作）

2021-01-05 15:38:50

打开Hello uni-app项目中的App.vue文件，复制以下内容到我们自己需要引入css样库的项目中的App.vue文件。在Hello uni-app项目中把上面引入的uni.css文件复制到我们的项目中，同样自己新建一个common目录，把它放到...

引入官方css样式库

创建官方演示模板Hello-uniapp
打开Hello uni-app项目中的App.vue文件，复制以下内容到我们自己需要引入css样库的项目中的App.vue文件。
在Hello uni-app项目中把上面引入的uni.css文件复制到我们的项目中，同样自己新建一个common目录，把它放到里面。

高效开发技巧

https://uniapp.dcloud.io/snippet

Iconfont 官网

1.首先在官网登录注册，选择你需要的图标加入购物车，可以多选

在这里插入图片描述

2.新建项目，把购物车中的图标添加到项目，然后下载到本地

在这里插入图片描述

3.解压后的文件如图所示，复制iconfont.css文件，粘贴到我们项目的common目录下，重命名为icon.css

在这里插入图片描述

4.打开我们复制过来的css文件，把里面引用了但是我们没有复制过来的文件的那几行删除掉，我们一般不需要用到。

在这里插入图片描述
留下data那一行，结尾用分号结束

5.在App.vue文件的style中引入

/* icon.css - 自定义图标库 */
	@import './common/icon.css';
12

6.在页面中使用

找到之前解压的文件，里面有一个demo的html文件，在浏览器中打开，选择font-class
在这里插入图片描述
在页面单击右键，检查

复制class中的内容，用到我们需要引入该图标的页面中，如下

运行即可显示。

收起

展开全文

uni-app

【Uni-App社区小程序】004-引入官方CSS样式库
2020-07-06 22:01:53
一、获取官方CSS样式库文件第一步：在空白处，鼠标右键新建项目 ...第三步：将官方CSS样式库复制到common文件夹第四步：引入官方CSS样式库文件，并复制uni.ttf文件，即可 ...
收起
vue webapp uni-app
Angular开发使用 ngx-bootstrap作为样式库
千次阅读 2018-02-08 11:45:01
bootstrap里面可以复制你想要的样式组件，官方有介绍怎么使用，不过本人稍微修改了下使用ngx-bootstrap的步骤1、npm install ngx-bootstrap –save2、npm install bootstarap –save-dev3、在angular-cli.json文件中...
收起
ng-zorro组件库默认样式修改
2020-09-05 09:20:49
当我们想修改组件默认的样式时，一般是通过F12控制台，定位到需要修改的DOM元素，然后找到它对应的class，然后复制去我们对应代码的 css/less 文件中重写覆盖原有的组件样式。 // 重写组件样式，高度修改为0 .ant-...
收起
angular less bootstrap
Vue 中 css scoped 样式穿透
2020-08-18 21:34:18
scoped看起来很好用，当时在Vue项目中，当我们引入第三方组件库时(如使用element-ui)，需要在局部组件中修改第三方组件库样式，而又不想去除scoped属性造成组件之间的样式覆盖。这时我们可以通过特殊的方式穿透...
收起
接口、数据库返回信息有中文的时候会显示unicode的样式
千次阅读 2019-02-19 15:49:32
@问题描述：接口、数据库返回信息有中文的时候会显示unicode的样式，如图解决方法： 1、robotframework为3.0.X 2、找到python安装目录下的\Lib\site-packages\robot\utils\unic.py文件引入json库：import json 将...
收起
javascript：可共享的配置，以在GrowFlow JavaScriptTypeScript项目中应用一致的语法和样式规则-源码
2021-02-23 04:03:52
将现有软件包的package.json之一复制到新文件夹中，并调整值。针对外部应用程序进行本地开发为了使外部前端的本地副本可以使用这些软件包之一的本地副本（例如@ growflow / eslint-config），我们必须在本地...
收起
SSM样式---以备日后复制
2020-08-23 17:08:30
注意：第一：在配置依赖时先在setting中检查是否是自己的本地库第二：对于出错(爆红)的依赖解决方案（1）将出错的依赖剪切再复制然后刷新（2）以上不能解决的将出错的依赖删除，在mvcproperties官网找相应的...
收起
mybatis log4j2
坚决UI组件的样式穿透问题
2020-08-24 20:43:05
scoped看起来很好用，当时在Vue项目中，当我们引入第三方组件库时(如使用element-ui)，需要在局部组件中修改第三方组件库样式，而又不想去除scoped属性造成组件之间的样式覆盖。这时我们可以通过特殊的方式穿透...
收起
css
Hexo添加代码复制按钮修改文章内超链接样式3修改阅读全文按钮样式修改主题页面布局为圆角引用块样式修改 ...
2020-06-01 20:14:56
第一次（2019年4月底）安装Hexo的时候使用的貌似是5.X的版本，在当时魔改的过程中发现该版本无法完美添加代码复制的按钮，于是在第二次部署的时候特意更换了7.1.1版本的，测试代码复制按钮通过以后就开始魔改其他的...
收起
hexo next
weex的css样式相关
2018-04-25 06:15:28
阿里提供的UI库weex引入css的方式行内样式内联在vue文件的style标签中<style> html{ background-color: #f00; } </style> 复制代码利用style标签的src属性导入<style ...
收起
在vue中怎么写行内样式高_.vue文件怎么写css样式
2021-01-11 20:40:02
.vue文件怎么请求api.vue文件怎么请求api1、首先我们安装axios网络请求库cdtest//进入项目根目录 npmiaxios-S//执行安装2、在需要使用请求的vue组件内，引入axios 请求示例 //引.vue文件怎么引入本地图片.vue文件...
收起
theme-context-storybook-repro：此仓库是在Storybook服务器上空的主题对象的复制-源码
2021-02-04 06:28:56
主题上下文故事书复制此仓库是描述的错误的再现。概述此回购协议主要受和而有所调整。它包含了： React本机Web React导航打字稿故事书样式化的组件 ... 样式组件中的theme对象是空的，因此为
收起
Intellij IDEA导入Github中的MAVEN多模块项目【保持项目样式】
2019-11-08 15:31:37
下面跟我一起入手吧！ ... checkout from version contril ---->...2、去git远程仓库复制git项目路径，注意：路径是http （https://github.com/wxxx/xxxx.git） ,还是ssh（git@github.com:wxxxx/xxxx.git) ） 3,...
收起
为type=file的input标签制定样式——CSS基础
2020-06-25 16:12:28
在现在的前端开发中，为了开发的效率，大都会引入第三方库加快开发速度。查阅官方文档，一顿复制黏贴，是的，这就是面向百度、面向谷歌编程，但是基础总是重要的——本文章记录一下之前遇到的小坑，并对其进行解析。...
收起
css html

uniapp如何引入官方的css样式库

uniapp引入css样式、图标库、动画库

uniapp如何引入官方的css样式库

uniapp如何引入的css图标库

uniapp如何引入的css动画库

jQuery库的简单使用:jQuery中的 DOM 操作,增删改查,复制,替换,包裹,属性和样式操作

jQuery中的 DOM 操作

查

增

改

删

练习

复制和替换

包裹节点

属性操作

样式操作

解决 Vue 项目中使用 iView 组件库设置样式不生效的问题

uni-app引入官方的css样式库、高效开发技巧（包括Iconfont 操作）

引入官方css样式库

高效开发技巧

Iconfont 官网

1.首先在官网登录注册，选择你需要的图标加入购物车，可以多选

2.新建项目，把购物车中的图标添加到项目，然后下载到本地

3.解压后的文件如图所示，复制iconfont.css文件，粘贴到我们项目的common目录下，重命名为icon.css

4.打开我们复制过来的css文件，把里面引用了但是我们没有复制过来的文件的那几行删除掉，我们一般不需要用到。

5.在App.vue文件的style中引入

6.在页面中使用

【Uni-App社区小程序】004-引入官方CSS样式库

Angular开发 使用 ngx-bootstrap作为样式库

ng-zorro组件库默认样式修改

Vue 中 css scoped 样式穿透

接口、数据库返回信息有中文的时候会显示unicode的样式

javascript：可共享的配置，以在GrowFlow JavaScriptTypeScript项目中应用一致的语法和样式规则-源码

SSM样式---以备日后复制

坚决UI组件的样式穿透问题

Hexo添加代码复制按钮修改文章内超链接样式3修改阅读全文按钮样式 修改主题页面布局为圆角 引用块样式修改 ...

weex的css样式相关

在vue中怎么写行内样式高_.vue文件怎么写css样式

theme-context-storybook-repro：此仓库是在Storybook服务器上空的主题对象的复制-源码

Intellij IDEA导入Github中的MAVEN多模块项目【保持项目样式】

为type=file的input标签制定样式——CSS基础

复制样式库中的样式

中央广播电视大学《液压气动控制技术课程设计》期末总复习资料（含答案）.pdf

如何更新Mac 上的钥匙串密码？

完美解决js无法上传大文件方法

2021-03-01

access应用的3个开发实例

模板信息提取阶段方案一

datasets.rar

中央广播电视大学《幼儿园课程与活动设计》期末总复习资料（含答案）.pdf

echarts入门

项目管理工具与方法

7.2 AVL树

MySQL 四类管理日志（详解及高阶配置）

自动换IP软件哪个更高效更好用

QRCode.js：使用 JavaScript 生成二维码

Tests.NetCore.Service：仅用于测试目的而创建的测试服务-源码

xgboost的使用总结

yolov5 python flask web目标检测

Mycat 实现 MySQL的分库分表、读写分离、主从切换

gitlab_download_python.zip

中央广播电视大学《学前儿童艺术教育（音乐）》期末总复习资料（含答案）.pdf

Angular开发使用 ngx-bootstrap作为样式库

Hexo添加代码复制按钮修改文章内超链接样式3修改阅读全文按钮样式修改主题页面布局为圆角引用块样式修改 ...