本文介绍了引导网格无法使用 xs 列的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!
问题描述
我在 Codepen 上开始了一个新项目,我正在使用引导程序.我已经有一段时间没有使用 CSS 了.网格系统对我没有响应,我找不到问题.我什至复制了一个可以工作的旧项目,但也没有工作..
I started a new project on Codepen and I'm using bootstrap.. It's been a while since I worked CSS. The grid sistem is not responding for me, I can't find the problem. I even copied a working older proyect and didn't work neither..
这是笔:http://codepen.io/Chantun/pen/NjgpaY
这是html:
<body>
<div class="container-fluid">
<div class="row">
<div class="col-xs-offset-3 col-xs-6">
<h1>FFC Calculator</h1>
</div>
</div>
</div>
</body>
这是 CSS:
body {
position: relative;
margin-top: 60px;
font-family: Arimo, 'Roboto Slab', serif;
background-color: #1a3a50;
text-decoration:none;
text-align: center;
color: white;
}
h1 {
position: relative;
font-family: Pacifico, 'roboto slab', serif;
font-size: 5vw;
}
这是头脑中的东西:
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="FCC calculator">
<meta name="keywords" content="FFC, calculator, Free, Codecamp">
<meta name="author" content="Santiago F. Rey">
<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,700' rel='stylesheet' type='text/css'>
推荐答案
笔使用的是Bootstrap 4,CSS类名发生了变化.xs 中缀已在 4.x 中移除...
The pen is using Bootstrap 4, and the CSS class names have changed. The xs infix has been removed in 4.x...
col-xs-offset-3 现在是 offset-3col-xs-6 现在是 col-6
<div class="container-fluid">
<div class="row">
<div class="offset-3 col-6">
<h1>FFC Calculator</h1>
</div>
</div>
</div>
http://codepen.io/anon/pen/JNyqWX
这篇关于引导网格无法使用 xs 列的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!
The End




大气响应式网络建站服务公司织梦模板
高端大气html5设计公司网站源码
织梦dede网页模板下载素材销售下载站平台(带会员中心带筛选)
财税代理公司注册代理记账网站织梦模板(带手机端)
成人高考自考在职研究生教育机构网站源码(带手机端)
高端HTML5响应式企业集团通用类网站织梦模板(自适应手机端)