html Del Mar全宽主页部分
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html Del Mar全宽主页部分相关的知识,希望对你有一定的参考价值。
<script>
$(document).ready(function() {
//// FULL-WIDTH HOMEPAGE SECTIONS
$('.homepage #content > section').removeClass().addClass('container-fluid');
$('.homepage div.section, .homepage #suggested, .homepage #additional').wrapInner('<div class="container"></div>');
$('.homepage #suggested, .homepage #additional').appendTo('.homepage article .section_boxes > div > div').addClass('section');
$('.homepage .clear').remove();
});
</script>
<style>
.homepage #content .section:nth-child(even) {
background-color: #c4bcb8;
}
.homepage #content .section:nth-child(odd) {
background-color: #d8d2cf;
}
.homepage .section_boxes .section {
margin-top: 0;
margin-bottom: 0;
padding: 60px 0;
}
.homepage h1,
.homepage #suggested h2 {
margin-top: 0;
}
.homepage #content .container-fluid {
padding: 0;
}
/*** Remove if using Del Mar Starter or Del Mar Bootstrap 3 Starter ***/
.section_Boxes .delmar-3box {
width: 100%;
}
.delmar-3box img {
max-width: 100%;
width: auto !important;
padding: 15px !important;
height: auto;
}
.delmar-3box h2, .delmar-3box div{
padding-right: 15px;
padding-left: 15px;
}
@media all and (min-width:768px){
.section_Boxes .delmar-3box {
width: 33.3333333%;
}
}
@media all and (max-width:768px){
.SideBySide .boxside {
width: 100%;
text-align: center;
}
.section_SideBySide .no-img-mask {
width: 100%;
}
}
#content .container-fluid > article {
padding-bottom: 0;
}
</style>
以上是关于html Del Mar全宽主页部分的主要内容,如果未能解决你的问题,请参考以下文章
html Del Mar高级主管
html Del Mar高级页脚
html Del Mar w / Bootstrap 3 Starter
css Del Mar按钮
css Del Mar CSS Starter
css 恒定接触全宽:这将使CC嵌入形式在主页上更加全宽并堆叠在小部件上