打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
新浪博客Banner通栏+背景图片代码
新浪博客Banner通栏+背景图片代码
转载▼
如何使用代码更改自己的Banner通栏+背景图片。
1.BANNER
剪切或制作一张大小为770*135象素(勿用其它大小的图片)的个性化Banner通栏图或者动画;
2, 将制作好的图或者动画上传到网上生成一个图片或动画的网址;
3, 将该网址复制入写好的代码相应“网址”位置中即可。
图片Banner通栏代码如下:
<CENTER><IMG style="LEFT: 104px; POSITION: absolute; TOP: 55px" align=right src=网址 width=770 height=135></CENTER>
动画Banner通栏代码如下:
<CENTER><EMBED style="LEFT: 104px; POSITION: absolute; TOP: 55px" align=right src=网址 width=770 height=135 type=application/x-shockwave-flash wmode="transparent" quality="high" ;></CENTER> 步骤如下:
(1)剪切或制作一张大小为770*135象素(勿用其它大小的图片)的个性化Banner通栏图或者动画;
(2)将制作好的图或者动画上传到网上生成一个图片或动画的网址;
(3)将该网址复制入写好的代码相应“网址”位置中即可。
(4)图片背景方式。支持后缀为:静态图片:*.jpg *.bmp;动态图片:*.gif
要进行背景图片修改,请加入以下代码:
图片Banner通栏代码如下:
<DIV align=left><IMG src="图片网址" align=left></DIV>
<STYLE type=text/css>
.banner
{background:url(图片网址) no repeat no scroll!
mportant;}
</STYLE>
动画Banner通栏代码如下:
<CENTER><EMBED style="LEFT: 104px; POSITION: absolute; TOP: 55px" align=right src=网址 width=770 height=135 type=application/x-shockwave-flash wmode="transparent" quality="high" ;></CENTER>
注意:这里是添加在已经建立好、有内容的模板里。
2. 如何使用代码更改自己的背景图片?
(1)图片背景方式。支持后缀为:静态图片:*.jpg *.bmp;动态图片:*.gif
要进行背景图片修改,请加入以下代码:
<DIV align=left><IMG src=" 网址" align=left></DIV>
<STYLE type=text/css>
body
{background:url(网址) repeat scroll!important;}
</STYLE>
或将以下代码加入文章开头
<div style='background:url(网址);'>
(2)动画背景方式。支持后缀格式 *.swf
<EMBED style="LEFT: 10px; POSITION: absolute; TOP: -70px" src="SWF文件网址" width=800 height=500 type=application/x-shockwave-flash wmode="transparent" quality="high">
将背景和Bannner图片修改统合起来就是:
<DIV align=left><IMG src=" 网址" align=left></DIV>
<STYLE type=text/css>
body
{background:url(网址) repeat scroll!important;}
.logo
{background:url(网址) no repeat no scroll!mportant;}
.banner
{background:url(网址) no repeat no scroll!mportant;}
<!__PHP Code Start__>
<div class="tb-module tshop-um tshop-um-lunbo">
<div class="J_TWidget section slide2" data-widget-type="Slide"
data-widget-config="{'navCls':'yslider-stick','contentCls':'yslider-stage','activeTriggerCls':'selected',
'delay':0.2,'effect':'fade','easing':'easeBoth','duration':0.8,'autoplay':false}">
<!--  code  -->
<div class="J_TWidget section">
<div class="yslider-stage">
<p><a href="<?php echo "$_MODULE[url1]" ?>" target="_blank"><img src="<?php echo "$_MODULE[pic1]" ?>"/></a></p>
<p><a href="<?php echo "$_MODULE[url2]" ?>" target="_blank"><img src="<?php echo "$_MODULE[pic2]" ?>" /></a></p>
<p><a href="<?php echo "$_MODULE[url3]" ?>" target="_blank"><img src="<?php echo "$_MODULE[pic3]" ?>" /></a></p>
</div>
<ul class="yslider-stick">
<li class="selected"><a href="$_MODULE[url1]" target="_blank">1</a></li>
<li><a href="$_MODULE[url2]" target="_blank">2</a></li>
<li><a href="$_MODULE[url3]" target="_blank">3</a></li>
</ul>
</div>
</div>
<!__PHP Code End__>
<!__XML Code Start__>
<?xml version="1.0" encoding="GBK"?>
<module>
<id>tshop-um-lunbo</id>
<name>轮播模块_950</name>
<file>tshop-um-lunbo.php</file>
<thumbnail>../../assets/images/default-thumbnail.png</thumbnail>
<description xsi:type="xs:string" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">{这是一个轮播模块_950}</description>
<requiredCache>true</requiredCache>
<supportedWidth>950</supportedWidth>
<themes default="默认">
<theme name="默认">
<css>assets/stylesheets/default.css</css>
</theme>
</themes>
<parameters>
<param name="pic1" label="轮播1图片地址" ptype="text" formType="text" description="950" >../tshop-um-lunbo/assets/images/pic1.jpg</param>
<param name="url1" label="链接地址" ptype="text" formType="text" description="." >#</param>
<param name="pic2" label="轮播2图片地址" ptype="text" formType="text" description="950" >../tshop-um-lunbo/assets/images/pic2.jpg</param>
<param name="url2" label="链接地址" ptype="text" formType="text" description="." >#</param>
<param name="pic3" label="轮播3图片地址" ptype="text" formType="text" description="950" >../tshop-um-lunbo/assets/images/pic3.jpg</param>
<param name="url3" label="链接地址" ptype="text" formType="text" description="." >#</param>
</parameters>
</module>
<!__XML Code End__>
<!__CSS Code Start__>
.tshop-um-lunbo {
width:950px;
height:289px;
overflow:hidden;
position:relative;
}
.tshop-um-lunbo .yslider-stick {
position:absolute;
width:160px;
height:33px;
bottom:10px;
right:10px;
z-index:99;
}
.tshop-um-lunbo .yslider-stick li {
float:left;
heigth:28px;
width:28px;
line-height:28px;
background:#f00;
text-align:center;
margin:2px;
}
.tshop-um-lunbo .yslider-stick li.selected a {
color:#000;
}
.tshop-um-lunbo .yslider-stick li a{
color:#fff;
font-weight:bold;
}
<!__CSS Code End__>
</STYLE>更换整体页面背景源代码
<STYLE type=text/css>
body
{background:url(博客整体页面背景图片地址) repeat scroll!important;}
</STYLE>
更换页面题图logo图片的源代码:
<STYLE type=text/css>
.logo
{background:url(博客最上方题图logo图片地址) no repeat no scroll!mportant;}
</STYLE>
更换页面横幅题图的源代码:
<STYLE type=text/css>
.banner
{background:url(横幅题图大图地址) no repeat no scroll!mportant;}
</STYLE>
更换页面横幅题图下面的菜单图片的源代码:
<STYLE type=text/css>
.menu{
background:url("题图下的长条菜单图片地址") no-
repeat center;}
</STYLE>
更换页面文章标题栏上翻时的图片的源代码:
<STYLE type=text/css>
.feeds .up{
background:url("文章标题栏上翻时的图片地址") no-
repeat center;}
</STYLE>
更换页面文章标题栏下翻时的图片的源代码:
<STYLE type=text/css>
.feeds .down{
background:url("文章标题栏下翻时的图片地址") no-
repeat center;}
</STYLE>
更换页面文章结尾处评论阅读菜单栏的图片的源代码:
<STYLE type=text/css>
.feeds .function{
background:url("文章结尾处评论阅读菜单栏的图片地址") no-
repeat right;}
</STYLE>
更换页面空白面板标题栏上翻时图片的源代码:
<STYLE type=text/css>
.links .up{
background:url("空白面板标题栏上翻时图片地址");}
</STYLE>
更换页面空白面板标题栏下翻时图片的源代码:
<STYLE type=text/css>
.links .down{
background:url(空白面板标题栏下翻时的图片地址);}
</STYLE>
更换页面空白面板的背景图片的源代码:
<STYLE type=text/css>
.links .mid{
background:url(空白面板的背景图片地址);}
</STYLE>
更换页面形象照片处的背景图片的源代码:
<STYLE type=text/css>
.photo .mid{
background:url(形象照片处的背景图片地址);}
</STYLE>
更换页面自定义空白面板背景图片的源代码:
<STYLE type=text/css>
.label .mid{
background:url(自定义空白面板的背景图片地址);}
</STYLE>
更换页面日历面板的背景图片的源代码:
<STYLE type=text/css>
.calendar .mid{
background:url("日历面板的背景图片地址");}
</STYLE>
更换页面公告栏标题栏上翻时图片的源代码:
<STYLE type=text/css>
.callboard .up{
background:url("公告栏标题栏上翻时图片地址");}
</STYLE>
更换页面公告栏标题栏下翻时图片的源代码:
<STYLE type=text/css>
.callboard .down{
background:url("公告栏标题栏下翻时图片地址");}
</STYLE>
更换页面公告栏的背景图片的源代码:
<STYLE type=text/css>
.callboard .mid{
background:url("公告栏的背景图片地址");}
</STYLE>
更换页面正文背景图片的源代码:
<STYLE type=text/css>
.bodyBg{
background:url("正文背景图片地址");}
</STYLE>
更换页面正文背景图片的源代码:
<STYLE type=text/css>
.bodyBottom{
background:url("正文背景图片地址");}
</STYLE>
更换页面正文文章页数图片的源代码:
<STYLE type=text/css>
.feeds .page{
background:url("正文文章页数图片地址") no-repeat center;}
</STYLE>
更换页面留言板标题栏上翻时的图片的源代码:
<STYLE type=text/css>
.gbook .up{
background:url('留言板标题栏上翻时的图片地址') no-repeat;}
</STYLE>
更换页面留言板标题栏下翻时的图片的源代码:
<STYLE type=text/css>
.gbook .down{
background:url('留言板标题栏下翻时的图片地址') no-repeat;}
</STYLE> 如何设置通栏页头背景http://www.docin.com/p-511464989.html图:
\begin{figure*}[htbp] % Requires \usepackage{graphicx}
\centering
\includegraphics[width=0.8\linewidth]{1} % 1\linewidth
\caption{The overview of delivery system.}
\label{fig2}
\end{figure*}
表table*
公式:
\newlength{\halfpagewidth}
\setlength{\halfpagewidth}{\linewidth}
\divide\halfpagewidth by 2
\newcommand{\leftsep}{%
\noindent\raisebox{4mm}[0ex][0ex]{%
\makebox[\halfpagewidth]{\hrulefill}\hbox{\vrule height 3pt}}%
\vspace*{-2mm}%
}
\newcommand{\rightsep}{%
\noindent\hspace*{\halfpagewidth}%
\rlap{\raisebox{-3pt}[0ex][0ex]{\hbox{\vrule height 3pt}}}%
\makebox[\halfpagewidth]{\hrulefill}%
}
使用方法:
\begin{multicols}{2}
Bla bla...
\end{multicols}
%
\leftsep
\begin{equation}
\label{eqn:planar:Hz02}
\left \{\begin{array}{l}
\delta A + \kappa B = 0 \\
(\kappa\sin\kappa d - \gamma\cos\kappa d)A + (\kappa\cos\kappa d + \gamma\sin\kappa d)B = 0
\end{array} \right.
\end{equation}
\rightsep
%
\begin{multicols}{2}
Bla bla...
\end{multicols}
【问题描述】
怎么在双栏排版中,让通栏的表格出现在页面底端?
[!b]等等的一些命令都不行啊
【问题扩展】
这个问题是排版通栏图表过程中,较为常见的问题。通常,我们排版双栏文章的时候,有些图比较宽,需要让图或者表格跨栏排版,这时我们会用到如下两个环境:
\begin{table*}[ht]
\end{table*}
\begin{figure*}[ht]
...
\end{figure*}
通常这样的跨栏图会放到页面的顶部。
【解决方案】
若是我们想让图表放置到页面底部的话,可以这样做:
导言区加入:\usepackage{stfloats}
插图的话使用如下环境:
\begin{figure*}[bp]
...
\end{figure*}
表格类似使用
\begin{table*}[bp]
...
\end{table*}
【示例代码】:
\documentclass[twocolumn]{book}
\usepackage{graphicx}
\usepackage{xcolor,stfloats}
\usepackage{lipsum}%生成随机文本
\begin{document}
\lipsum
\lipsum[2-5]
\begin{figure*}[b]
\centering
\includegraphics[width=12cm]{image}
\end{figure*}
\lipsum[2-5]
\lipsum
\end{document}
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
新浪博客代码集
html+css如何在图片上添加文字
使用CSS添加banner图片
css实现背景图拉伸(图例)
网页的背景图片代码
CSS入门教程——背景属性(background)
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服