我利用xs sm md lg列来定义不同屏幕尺寸的列应该有多大。它工作正常但我希望有更好的调整控件并定义我自己的自定义尺寸。
例如,我希望在xs和sm之间存在col大小。
我添加了一个col-ss类,如下所示:
@media (min-width: 600px)
.col-ss-4 {
width: 33.33333333333333%;
}
@media (min-width: 600px)
.col-ss-1, .col-ss-2, .col-ss-3, .col-ss-4, .col-ss-5, .col-ss-6, .col-ss-7, .col-ss-8, .col-ss-9, .col-ss-10, .col-ss-11, .col-ss-12 {
float: left;
}
并像这样添加了这个类:
<div class="col-sm-5 col-ss-4">Content Here</div>
但它似乎没有效果。
答案 0 :(得分:2)
Bootstrap是一个非常大的框架。如果您正在寻找更改基础结构,那么您将不再使用引导程序,这很好。但是,您希望通过使用LESS和SASS等预处理器来修改引导程序的基础。这至少可以让你保持代码模块化。通过修改以下内容可以很容易地添加这样的东西。
github variables.less github grid.less
如果您正在寻找比这更具体的答案,那么您最好按照教程逐步完成。
对于时间估计,预计第一次这样做大约需要30-45分钟。
答案 1 :(得分:1)
浏览此页面以及#34;自定义&#34;一切引导。然后,您可以导出结果。
答案 2 :(得分:1)
您可能想尝试以下代码。您没有对同一public class FilterListFragment extends ListFragment implements SearchView.OnQueryTextListener {
private ItemListAdapter mAdapter;
public FilterListFragment() {
//Required empty constructor
}
public static FilterListFragment newInstance() {
return new FilterListFragment();
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_filter_string_list, container, false);
//Tell the system to call onCreateOptionsMenu
setHasOptionsMenu(true);
initialize(view);
return view;
}
List<Victoria> list = new ArrayList<Victoria>();
private void initialize(View view) {
String[] items = getActivity().getResources().getStringArray(R.array.items);
String[] itemDescriptions = getActivity().getResources().getStringArray(R.array.itemDescriptions);
for (int n = 0; n < items.length; n++){
Victoria victoria = new Victoria();
victoria.setID();
victoria.setItem(items[n]);
victoria.setItemDescription(itemDescriptions[n]);
list.add(victoria);
}
mAdapter = new ItemListAdapter(list, getActivity());
setListAdapter(mAdapter);
}
@Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
// Set up search view
inflater.inflate(R.menu.menu_search, menu);
MenuItem item = menu.findItem(R.id.search);
SearchView searchView = (SearchView) MenuItemCompat.getActionView(item);
searchView.setOnQueryTextListener(this);
searchView.setQueryHint(getResources().getString(R.string.search_query));
}
@Override
public boolean onQueryTextSubmit(String newText) {
return false;
}
@Override
public boolean onQueryTextChange(String newText) {
mAdapter.getFilter().filter(newText);
return false;
}
}
min-width
的最低多个媒体查询。如果你可以少用,你就可以复制课程。
您可以使用bootstrap customize
自定义引导程序文件size