Nội quy chuyên mục: - Khu vực này chỉ dành cho việc chia sẻ các theme... đã hoàn thiện (nhưng chưa được duyệt tại NukeViet Store http//nukeviet.vn/vi/store/) để mọi người tải về sử dụng thử và đóng góp ý kiến hoàn thiện module.
- Vui lòng không gửi các câu hỏi và các yêu cầu trợ giúp vào đúng chủ đề, Không tạo các câu hỏi mới tại đây! Topic vi phạm nội quy sẽ bị xóa ngay lập tức!
#174378 gửi bởi lyhuutrong
Ngày 09 Tháng 12 2015 , 11:14
Demo : Hình ảnh
Hiện tại mình có tải code thủ khoa nukeviet 3.4 nhưng mình muốn bỏ phần đó và sửa lại thành màu nền trong khung footer đó ạ.mình muốn cho nó thành màu xanh hết chứ không phải viền ngoài màu xanh mà bên trong màu trắng. Và mình muốn viết nhiều dòng cho dễ. Hiện tại thì khung đó nó chỉ cho viết có 2 dòng à.hichic. qua dòng thứ 3 thì nó bị nhảy khung. Các bạn ơi. giúp mình với ạ. thanks các bạn nhiều lắm ạ.
Đây là code của mình ạ.

Code template.css :
Mã: Chọn hết
body{
font: 12px/1.4 Arial, Helvetica, sans-serif;
background: #fff url(../images/bg.jpg) center top no-repeat;
}

a:link, a:active, a:visited{
color: #3269aa;
text-decoration: none;
}

a:hover{
color: #f72836;
}

#container{
width: 980px;
margin: 0 auto;
margin-top:10px;
font: 12px/1.4 Arial, Helvetica, sans-serif;
background: #fff url(../images/centar_bg.gif) repeat-x;
}

#header{
width: 980px;
height: 103px;
margin: 0 auto;
position: relative;
}

#header #logo{
width: 450px;
float: left;
}

#header #logo img{
height: 100px;
vertical-align: middle;
}

#menu{
width: 980px;
height: 40px;
border-top:1px solid #d1edf9;
border-left:1px solid #d1edf9;
border-right:1px solid #d1edf9;
margin: 0 auto;
background: #3673b1 url(../images/mainnav-bg.gif)repeat-x;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(./themes/thukhoa/css/boder.htc);
}
.inputbox {
padding: 3px 2px;
border: 1px solid #BBE1F1;
background: url(../images/input-bg.gif) repeat-x top #FFFFFF;
color: #333333;
font-size: 100%;
}

.button {
padding: 3px 8px 3px;
border: 1px outset #BBE1F1;
webkit-border-radius:5px 0px 0px 5px;
-moz-border-radius:0px 5px 5px 0px;
background:none;
color: #fff;
text-transform: uppercase;
font-size: 92%;
font-weight: bold;
}

.button:hover {
border: 1px inset #BBE1F1;
}

div.contentwrapper{

}

div.contentcolumn p{
padding: 4px 0;
}

div.box form.login{
padding: 0 10px 10px 10px;
}

div.box form.login input.txt{
border: 1px solid #b2b0b1;
padding: 3px;
width: 160px;
}

div.box form.login label{
display: block;
font-weight: 700;
padding: 5px 0 4px 0;
}

div.box form.login img{
vertical-align: middle;
}

div.box div.signed img{
border: 1px solid #ccc;
padding: 2px;
margin-right: 4px;
width: 80px;
}

div.box div.signed a{
display: block;
color: #333;
}

div.online p{
margin: 0 0 4px 0;
}

div.online img{
vertical-align: middle;
margin-right: 2px;
}

div.online span.item{
padding: 0 0 0 20px;
}

div.online span.item strong{
padding-right: 4px;
}

div.box p.about{
text-indent: 20px;
text-align: justify;
padding: 10px 4px;
}

div.box div.ads{
padding: 10px 4px;
}

form.newsletter{
padding: 4px;
}

form.newsletter input.txt{
font-size: 11px;
color: #999;
padding: 4px;
width: 150px;
margin-right: 4px;
}


#ja-botnav p.footer, p.show_query{
padding: 0 10px;
margin: 0;
font-size: 11px;
color: #9c9c9c;
}

#ja-botnav {
width: 980px;
margin: 0 auto;
background: url("../images/footer_bg.jpg") repeat-x scroll center top #5E98CA;
clear: both;
padding: 10px 0;
text-align: center;
font-weight:bold;
height:70px;
border:1px solid #0075B0;

}

#ja-botnav ul {
margin: 0;
padding: 0;
}

#ja-botnav li {
margin: 0;
padding: 0 10px;
background: url(../images/vline.gif) no-repeat left center;
display: inline;
}

#ja-botnav li a {
color: #333333;
}

#ja-botnav li a:hover, #ja-botnav li a:active, #ja-botnav li a:focus {
color: #0075B0;
}


#ja-botsl {
width: 970px;
margin: 0 auto;
margin-top:4px;
clear: both;
padding: 5px 5px;
background: #E1E2E3;
border: 1px solid #D1D5DA;
-moz-border-radius:5px 5px 5px 5px;
color: #333333;
}
div.box form.voting{
padding: 10px;
}

h3.breakcolumn{
line-height: 27px;
border-bottom: 1px solid #ccc;
font-weight: normal;
}

h3.breakcolumn span.breakcolumn{
font-size: 14px;
font-weight: bold;
padding: 0 4px;
}
h3.breakcolumn a{
font-weight: bold;
}

.column,.span-1,.span-2,.span-3,.span-4,.span-5,.span-6,.span-7,.span-8,.span-9,.span-10,.span-11,.span-12,.span-13,.span-14,.span-15,.span-16,.span-17,.span-18,.span-19,.span-20,.span-21,.span-22,.span-23,.span-24,.span-25{
float: left;
margin-right: 10px;
}

.last{
margin-right: 0 !important;
}

.span-4{
width: 150px;
}

.span-5{
width: 190px;
}

.span-6{
width: 230px;
}

.span-7{
width: 270px;
}

.span-8{
width: 310px;
}

.span-9{
width: 330px;
}

.span-10{
width: 390px;
}

.span-11{
width: 430px;
}

.span-12{
width: 470px;
}

.span-13{
width: 530px;
background: url(../images/conten_bg.jpg) repeat-y;
border-right:5px solid #3269AA;
border-bottom:5px solid #3269AA;
border-top: 5px solid #3269AA;
}


.span-16{
width: 630px;
background: url(../images/conten_bg.jpg) repeat-y;
border-right:5px solid #3269AA;
border-bottom:5px solid #3269AA;
border-top: 5px solid #3269AA;

}
.bodytexts{
width: 100%;
background: url(../images/conten_bg.jpg) repeat-y;
border-right:5px solid #3269AA;
border-bottom:5px solid #3269AA;
border-top: 5px solid #3269AA;

}

div.book{
margin:10px 10px 10px 60px;
}
.span-19{
width: 750px;
}

.span-25{
width: 370px;
}

hr{
background: #ccc;
color: #ccc;
clear: both;
float: none;
width: 100%;
height: .08em;
margin: 0;
border: none;
}

img.refresh{
cursor: pointer;
padding-left: 10px;
}

div.box{
margin-bottom: 15px;
width: 100%;
}

div.content{
padding: 8px;
}

div.silver{
background: #f2f2f2;
}

div.white, ul.list_item li.second{
background: #fff;
}

div.orange{
background: #ffe9da;
}

div.bordersilver{
border: 1px solid #d9d9d9;
}

div.box h3.header{
border: 1px solid #0f69e2;
border-bottom: 2px solid #fff;
height: 28px;
line-height: 28px;
color: #fff;
text-indent: 10px;
background: #0B41A5 url(../images/h3.header.jpg) repeat-x;
}

div.box h3.header a{
color: #fff;
}

div.box h3.header strong,.box_silver strong,.box_orange strong{
padding-right: 4px;
color: #0f0;
}

.box_silver{
background: #f2f2f2;
border: 1px solid #EBEBEB;
}

.box_silver .header{
background: url(../images/cat-header-bg.png) repeat-x center;
height: 28px;
line-height: 28px;
color: #000;
text-indent: 10px;
}

.box_orange{
background: #FC3;
border: 1px solid #EBEBEB;
}

.box_orange .header{
background: #FC3;
height: 28px;
line-height: 28px;
color: #000;
text-indent: 10px;
}

form div.submit{
background: url(../images/button01_r.png) top right no-repeat;
padding: 0 2px 0 0;
float: left;
}

form div.submit input{
border: 0;
color: #333;
height: 22px;
line-height: 22px;
display: block;
background: url(../images/button01_l.png) top left no-repeat;
cursor: pointer;
}

a.forgot{
display: block;
line-height: 22px;
height: 22px;
white-space: nowrap;
color: #0674f1;
font-size: 11px;
padding-left: 4px;
}

a:hover.forgot{
color: #333;
}

.bggreen{
background: #e9ffd4;
}

#ver_menu{
padding-bottom: 6px;
text-indent: 24px;
}

#ver_menu a{
background: #e4e4e4 url('../images/vertical_menu_bg.jpg') no-repeat left top;
color: #333;
display: block;
font: bold 11px/24px tahoma, arial, sans-serif;
height: 25px;
text-decoration: none;
}

#ver_menu a.current{
background: #ffd9d9 url('../images/vertical_menu_bg.jpg') no-repeat left -25px;
color: #333;
}

#ver_menu a.sub_normal{
background: #f5fbfe url('../images/vertical_menu_bg.jpg') no-repeat left -75px;
color: #333;
padding-right: 5px;
text-align: right;
}

#ver_menu a.sub_current{
background: #f5fbfe url('../images/vertical_menu_bg.jpg') no-repeat left -75px;
color: #cb0000;
padding-right: 5px;
text-align: right;
}

#ver_menu a.current:hover{
background: #ffd9d9 url('../images/vertical_menu_bg.jpg') no-repeat left -25px;
color: #0943ae;
}

#ver_menu a:hover{
background: #d9e5ff url('../images/vertical_menu_bg.jpg') no-repeat left -50px;
color: #cb0000;
}

ul.list_item{
padding: 0 2px 10px;
}

ul.list_item li{
padding: 8px 10px;
border-bottom: 1px solid #ccc;
padding-bottom: 10px;
clear: both;
}
div.module h3
{
margin: 0px 5px 12px;
padding: 0 0 0 28px;
font-size: 100%;
height: 28px;
line-height: 22px;
color: #FFFFFF;
background: url("../images/icon_h3.gif") no-repeat scroll 0 0 transparent;
text-transform:uppercase;

}
div.module h3 span {
display: block;
height: 28px;
background: none;
}

div.module {
padding: 0;
float: left;
clear: both;
width: 98.9%;
background: #FFFFFF url(../images/conten.gif) repeat-x scroll center top;
overflow: hidden;
margin-bottom: 8px;
border:1px solid #3F8BC5;
color:#000000;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
behavior: url(./themes/thukhoa/css/boder.htc);
}

div.module div{
margin: 0;
padding: 0;
background: none;
}

div.module div div{
padding: 0;
margin: 0;
background: none;
}

div.module div div div{
padding: 8px 10px 10px;
background: none;
}

div.module div div div div {
margin: 0;
padding: 0;
background: none;
}
ul.listnews{padding:0 2px 10px}
ul.listnews li{border-bottom:1px solid #37bbb9;padding:8px 10px}
ul.listnews li a{font-weight:bold}
ul.listnews li a img{border:1px solid #37bbb9;}
/* block ambum */
.block_album {
width: 190;
background: url(../images/block_ambum.png) repeat-x;
border-bottom: #dedede 1px solid;
padding: 5px;
margin-top: 8px;
min-height: 180px;
}

.block_album .items {
margin-bottom: 5px;
margin-top: 5px;
float: left;
margin-right: 15px;
}

.block_album .items img {
float: left;
margin-left: 10px;
width: 155px;
padding: 2px;
border: #CCC 1px solid;
}

.block_album .items a {
color: #000;
font-weight: bold;
text-decoration: none;
}

.block_album .alllink {
text-align: right;
float: right;
}

.block_album .alllink a {
color: #F00;
}



Còn đây là Code footer.tpl trong layout ạ :

Mã: Chọn hết
<div class="clear"></div>

</div>
<div id="ja-botsl" class="clearfix"></div>
<div id="ja-botnav">
<div class="advs bannergroup">
[FOOTER_SITE]
</div>
<div class="clear">
</div>
<div id="run_cronjobs" style="visibility: hidden; display: none;">
<img alt="" title="" src="{THEME_IMG_CRONJOBS}" width="1" height="1" />
</div>
</div>
</body>
</html>
<!-- BEGIN: theme_type -->
{LANG.theme_type_select}: <!-- BEGIN: loop --><!-- BEGIN: other --><a href="{STHEME_TYPE}" title="{STHEME_INFO}">{STHEME_TITLE}</a><!-- END: other --><!-- BEGIN: current -->{STHEME_TITLE}<!-- END: current --><!-- BEGIN: space --> | <!-- END: space --><!-- END: loop --><!-- END: theme_type -->