WordPress网站|主题|样式修改细节_02

WordPress细节记录之自定义侧边栏

2018-09-03 by Beyond

如果想要引入网易云音乐播放器,只需要仪表盘->外观→小工具→自定义HTML

代码如下:

<div id="id_div_music_container" style="position:relative;width:275px;height:400px;">
	<iframe id="id_iframe_music" frameborder="no" border="0" marginwidth="0" marginheight="0" width=275 height=400 src="//music.163.com/outchain/player?type=0&id=2383140890&auto=0&height=400"></iframe>
	
	<div id="id_div_footer" style="cursor:pointer;position:absolute;bottom:10px;right:10px;width:255px;height:40px;background:rgb(237,237,237);display:flex;align-items:center;justify-content:center;">
		<div style="color:rgb(228,0,30);text-shadow: 1px 1px 1px #bbb;">↓ 未闻花名<span style="color:#ccc"> | </span>vwhm.net ↓
		</div>
	</div>
</div>

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
	$("#id_div_footer").click (function(){
		var oldHeight = $("#id_div_music_container").height()
		window.newHeight = oldHeight < 1400 ?oldHeight + 600:400
		$("#id_div_music_container").css("height",window.newHeight)
		$("#id_iframe_music").css("height",window.newHeight)		
	})
</script>

效果如下:

当点击面板底部时,div会自动拓展延伸

因为加载太卡了, 后来就又去掉了, 特此记录一下,以后自己写一个

WordPress细节记录之防止table把页面撑开

2018-09-03 by Beyond

如果出现table内容太长把页面撑开的情况时,

只需要在table外面加一层div,并设置div样式如下:

.class_div {
    overflow-x: auto; 
    overflow-y: auto; 
    width: 100%;
}

这样table就会出现水平滚动条,不会再把body给撑开了

当然,另外一种做法是让table中的td能够强行自动换行,下回补充