Question

我需要在页脚中做出一个响应标识，它应该居中。我以为我可以通过bootstrap以下方式解决它：

HTML

 <!-- Footer -->
    <div class="container-fluid">
        <div class="row">
            <div class="landing img-responsive footer">
                <div>
                    <img src="~/img/logo-white-small.png" />
                </div>
            </div>
        </div>
    </div>

CSS

.landing.img-responsive.footer {
    margin: 0 auto;
}

但这是不正确的？

Answer 1

我建议你使用

 <center><img src="~/img/logo-white-small.png" /></center>

或者

<div style="text-align:center" class="img-responsive">
         <img src="~/img/logo-white-small.png" />
</div>

同时检查你css中这些类之间 .landing .img-responsive .footer 之间的空格。

Answer 2

您可以使用：

.img-responsive

使图像居中，同时添加引导程序的public class MyAsyncTask extends AsyncTask<Void,Void,Void> { //use context for activity reference private Context context_; public MyAsyncTask(Context context) { this.context_=context; } @Override protected void onPreExecute() { super.onPreExecute(); } @Override protected Void doInBackground(Void... voids) { return null; } @Override protected void onPostExecute(Void aVoid) { super.onPostExecute(aVoid); if(mCallBack!=null ){ mCallBack.onSuccess("Success"); }else { mCallBack.onError("Error"); } } MyAsyncCallBack mCallBack=null; public MyAsyncCallBack getmCallBack() { return mCallBack; } public void setmCallBack(MyAsyncCallBack mCallBack) { this.mCallBack = mCallBack; } public interface MyAsyncCallBack{ public void onSuccess(String successMessage); public void onError(String successMessage); }类部分以使其响应。

http://www.liquibase.org/documentation/include.html

Answer 3

响应式图像的用户img-responsive类。使用center-block类来水平对齐元素中心。

<img src="~/img/logo-white-small.png" class="img-responsive center-block" />

它会使您的图像响应以及水平居中对齐。无论如何，如果你想垂直对齐，那么你应该使用display：table-cell for child div和display：table for parent div。您还需要从子div中删除float属性。

响应式img with boostrap

3 个答案: