[英]Is it possible to not target the banner in the body?
我遇到了一個問題。我希望橫幅隨着瀏覽器的擴展而增加尺寸,但不能容納正文的內容。 因此,我決定不允許正文內容擴展,我將執行以下媒體查詢:
@media (min-width:1281px){
#homepage .carousel .carousel-caption {
left:auto;
right:auto;
max-width:1263px;
margin-left:70px;
}
/*.footer-links{
margin:auto;
max-width:1263px;
}
.bodyPages{
margin:auto !important;
max-width:1263px !important;
}
#searchForm{
margin:auto !important;
max-width:1263px !important;
}
}*/
/*.content-wrapper{
margin:auto;
max-width:1263px !important;
}
.carousel-wrapper{
max-width:100%;
}*/
body{
max-width:1263px !important;
margin:auto;
}
:not(.carousel-inner img){
}
.carousel-inner img {
height: auto;
width: 100%;
}
}
更新2:
<cfoutput>
<cfinclude template="inc/html_head.cfm" />
<body id="#$.getTopID()#" class="#$.createCSSHook($.content('menuTitle'))#" data-spy="scroll" data-target=".subnav" data-offset="50">
<!--- <cfinclude template="inc/navbar.cfm" /> --->
<!--- Navbar's display below is set to absolute position --->
<cfinclude template="inc/navbar_ap.cfm" />
<div id="resizable-section">
<!---
The Carousel/Slideshow
Refer to the theme's contentRenderer.cfc for details on this method and its arguments/options
NOTES:
* This theme is designed for Mura 6.1+
* Only content items with an 'Associated Image' will be rendered
* You can control the crop of the carousel image by using the custom defined 'carouselimage' image size // 'carouselimage'
--->
<!--- #$.dspCarouselByFeedName(
feedName='Slideshow'
, showCaption=true
, cssID='myCarousel'
, size='carouselimage'
, interval=5000
, autoStart=true
)# --->
#$.dspCarouselByFeedName(
feedName='Slideshow'
, showCaption=true
, cssID='myCarousel'
, size='custom'
, interval=10000
, autoStart=true
)#
<div class="container-fluid bodyPages">
<div class="row">
<!-- expanded width of the following section. -->
<!--<section class="col-lg-8 col-md-8 col-sm-12 col-xs-12 content">-->
<section class="col-lg-offset-1 col-lg-10 col-md-12 col-sm-12 col-xs-12 content" id="home-content">
<!--- The content --->
#$.dspBody(
body=$.content('body')
, pageTitle=''
, crumbList=false
, showMetaImage=false
)#
<!--- Display Objects assigned to display region 2 (Main Content) --->
#$.dspObjects(2)#
</section>
<aside class="col-lg-3 col-md-4 col-sm-12 col-xs-12">-->
<!--- Display Objects assigned to display region 3 (Right Column) --->
<!--#$.dspObjects(3)#-->
<!--</aside>-->
</div><!--- /.row --->
<cfinclude template="inc/footer.cfm" />
</div><!-- /.container -->
</div><!-- /.resizable-text -->
<cfinclude template="inc/html_foot.cfm" />
我相信您遇到的問題是因為您要為整個身體設置最大寬度,並且橫幅位於身體內。 這意味着您的橫幅廣告永遠不能大於您指定的1263px最大寬度。
無需更改整個身體的大小,而是需要為內容創建包裝。 您還需要為橫幅創建包裝。
這是一些HTML:
<body>
<div class="banner">
Banner Content goes here
</div>
<div class="content-wrapper">
Page content goes here
</div>
</body>
和一些CSS:
body {width:100%;}
.content-wrapper {
max-width:1263px;
}
.banner-wrapper {
width:100%;
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.