gpt4 book ai didi

html - Weebly 模板侧边栏

转载 作者:行者123 更新时间:2023-11-28 09:13:47 25 4
gpt4 key购买 nike

所以我正在使用 DivTag Templates for Weebly 中的模板。我去找他们寻求帮助,他们说他们帮不了我,因为这不是问题,只是一种定制。 :( 我的客户问是否可以将模板上的侧边栏从右侧移动到左侧。我说我相信,但会检查。我能找到的侧边栏页面的唯一 CSS HTML 是:

我找不到任何地方说目前侧边栏在右边。我对 weebly 的问题是它们在页面上有拖放区域,我注意到侧边栏有一个单独的拖放区域。

该特定页面的 HTML:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=1024">

<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>

<!-- JS -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

</head>

<body class='no-header wsite-theme-light'>

<div class="note" style="text-align: center;"><p>This gap is here to allow you to see the text tool bar for the header bar below. When site is published, the gap will disappear</p></div>

<div id="wrapper">

<div id="bar">
<div class="frame clearfix">
<div class="bar-text"><p>{call:text}</p></div>
<div id="search-button"><i class="af-search"></i></div>
<div class="social-frame">{social}</div>
<div class="search-bar">{search}</div>
</div>
</div>

<header id="header">
<div class="navContainer clearfix">
<div class="logo med-padding">{logo}</div>
<nav><div id="navigation">{menu}</div></nav>
</div>
</header>

<div id="main" role="main">
<div class="frame">
<div class="content table">
<div class="column32 table-content large-padding">{content} </div>
<div class="column3 table-content large-padding sidebar-content">{side:content}</div>
</div>
</div>
</div>

<footer>
<div id="footer" class="large-padding clearfix">
<div class="frame">
<div class="note" style="text-align: center;"><p>Drag &amp; drop footer content here</p></div>
<div id="footer-content" class="med-padding">{bottom:content} </div>
<div id="footer-content" class="med-padding" style="display:none;">{footer}</div>
</div>
</div>
<div id="footer-bottom" class="feature small-padding">
<div class="frame">
<div class="copyright"><p>{copyright:text}</p></div>
</div>
</div>
</footer>


</div>


<script type="text/javascript" src="/files/theme/basic-header.js"></script>

</body>
</html>

CSS:

/* --------------------------------------------------------------
LAYOUT
--------------------------------------------------------------- */
/* GENERAL */
.text-box-dark{
padding: 30px !important;
background: rgba(0,0,0,0.8) !important;
}

.text-box-light {
padding: 30px !important;
background: rgba(255,255,255,0.8) !important;
}

.xsmall-padding {
padding: 10px 0;
}

.small-padding {
padding: 20px 0;
}

.med-padding {
padding: 30px 0;
}

.large-padding {
padding: 45px 0;
}

.xlarge-padding {
padding: 65px 0;
}

.aligncenter {
text-align: center;
}

.sidebar-page div#content {
background: none;
width: 100%;
padding: 0;
}

.column2{
width: 50%;
min-width: 500px;
float: left;
}

.column3 {
width: 200px;
min-width: 200px;
min-height: 300px;
padding: 25px 20px;
background: url('sidebarbg.jpg');
border-left: 1px solid #eee;
vertical-align: top;
}

.column3 .weebly-area {
min-width: 200px;
min-height: 300px;
}

.column32 {
min-height: 300px;
min-width: 730px;
padding-right: 30px;
vertical-align: top;
}

div.sidebar-content {
min-height: 200px;
padding: 25px 45px;
}

.table{display: table;}
.table-content{display: table-cell;}
.center-content.table { height: 100%; margin: 0 auto;}
.center-content.table .table-content {vertical-align: middle;}
.overflow-hidden{overflow: hidden;}
.overflow-visible{overflow: visible;}

当您找到解决方案时。你能向我解释一下为什么它需要像你所说的那样吗?我正在努力学习,吸收的知识越多越好。

非常感谢。

最佳答案

耶得到了一些很好的建议,我想我会与其他人分享

在 HTML 中将第 3 列移到第 32 列之上

<div id="main" role="main">
<div class="frame">
<div class="content table">
<div class="column32 table-content large-padding">{content} </div>
<div class="column3 table-content large-padding sidebar-content">{side:content}</div>
</div>

关于html - Weebly 模板侧边栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26386752/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com