WordPress文章内添加特色广告代码 原创教程代码

2935868921

发表文章数:76

首页 » WordPress » 正文

WordPress文章内添加特色广告代码 原创教程代码

 


class=”feedback fb-primary”凌云科技

class=”feedback fb-danger”凌云科技

class=”feedback fb-warning”凌云科技

class=”feedback fb-info”凌云科技

class=”feedback fb-purple” 凌云科技

主题添加教程

将下面的代码添加到主题的css文件,dux添加到mian.css

.feedback {
height: 80px;
margin: 0px -20px 0px -20px;
color: #fff;
overflow: hidden;
margin-bottom: 10px;
}
.fb-primary {
background-color: #50b7ff;
}
.fb-danger {
background-color: #ff5f53;
}
.fb-warning {
background-color: #f9c13e;
}
.fb-info {
background-color: #1ac5e2;
}
.fb-purple {
	background-color: #b771e8;
}

.feedback span {
	font-size: 28px;
	float: left;
	padding: 0px 0px 0px 20px;
	line-height: 80px;
}

.feedback a {
	margin: 22px 20px 0px 0px;
	float: right;
	position: relative;
	height: 36px;
	line-height: 36px;
	border: 1px solid #fff;
	display: inline-block;
	font-size: 16px;
	padding: 0 26px;
	color: #fff;
	text-decoration
none;
}

.feedback a:hover {
	background-color: #fff;
	color: #000000;
	text-decoration: none
}

@media (max-width: 640px) {
	.feedback span {
		font-size: 12px;
		float: left;
		padding: 0px 0px 0px 20px;
		line-height: 50px;
	}

	.feedback a {
		margin: 12px 20px 0px 0px;
		float: right;
		position: relative;
		height: 26px;
		line-height: 26px;
		border
1px solid #fff;
		display: inline-block;
		font-size: 12px;
		padding: 0 18px;
	}

	.feedback {
		height: 50px;
	}
}

前台调用样式(参考上方css演示)

<div class="feedback fb-danger">
<span>小狐狸主题v2系列 专注于工体美学</span>
<a href="https://www.vizyw.com/4213.html">
使用教程</a></div>

未经允许不得转载:作者:2935868921, 转载或复制请以 超链接形式 并注明出处 小狐狸资源网
原文地址:《WordPress文章内添加特色广告代码 原创教程代码》 发布于2020-07-18

分享到:
赞(0) 打赏 生成海报
招聘广告位

评论 抢沙发

9 + 1 =


长按图片转发给朋友

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

支付宝扫一扫打赏

微信扫一扫打赏

Vieu4.5主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。
切换注册

登录

忘记密码 ?

切换登录

注册