锐客网

  1. 首页 > 睿知 > it技术 > >

在块中将元素一个接一个地移动

IT知识cssphpWordPress网站开发问答

我的网站有这个小问题。我想将块标题和第二行移动到中心, 然后将按钮也保持在中心, 如下所示：
形象想看
当前看起来像这样：
当前外观
在页面底部可以看到此表格。这是我自己定制的工作, 我更新了此CSS类：

.heading { font-family: GOTHAM-BOLD; font-size: 28px; color: #273a55; margin-left:340px; // i added this line, but seems it mess entire look. }

这是该形式的PHP代码：
< div class="footer box"> < div class="bluebg box"> < /div> < div class="container"> < div class="footermain box"> < div class="footertop box"> < div class="row"> < div class="col-md-6 nopd"> < div class="ftleft box"> < div class="ftlinner box"> < h1 class="heading"> < ?php echo (get_field('news_letter_title'))?get_field('news_letter_title'):get_field('news_letter_title', 'option') ?> < /h1> < ?php echo (get_field('news_letter_tag'))?get_field('news_letter_tag'):get_field('news_letter_tag', 'option') ?> < /div> < /div> < /div> < ?php endwhile;

似乎包含在一个类中的标题标题和行波纹管称为标题。因此, 现在的问题是移至中心以开始看起来像所提供的图像。
#1 按着这些次序 ：
  • 将文本块和按钮块中的col-md-6类更改为col-md-12。
  • 像这样将class text-center添加到text列
    < div class =” col-md-12 nopd文本中心” >
  • 添加样式justify-content：中心；这样的” 页脚盒” ：
    < div class =” footertop box” style =” justify-content：center; ” >
  • 从按钮列中删除noleft类, 并向按钮添加margin：0
在块中将元素一个接一个地移动

文章图片
#2 据我了解, 你想使文本居中, 并在其下方的按钮以快速解决, 请将此类添加到CSS中：
.footertop.box .row { display: block; width: 100%; text-align: center; }

【在块中将元素一个接一个地移动】删除div.row中的div的col-md-6类

    推荐阅读


    上一篇：多作者WordPress主题

    下一篇：面试官说（你来设计一个短链接生成系统吧）