CSS------ul与div如何排成一行
如图:


代码:(需要给div的float属性设置为left)
<div style="margin-top:10px">
<div style="float:left;width:30px;height:60px;background-color:#aaa"><</div>
<ul>
@foreach (ProductImage item in ViewBag.ProductImages)
{
<li style="display:inline-block;border:1px solid #bce8f1">
<img src="/upload/store/@ViewBag.StoreId/product/show/thumb60_60/@item.showimg" />
</li>
}
</ul>
</div>
CSS------ul与div如何排成一行的更多相关文章
- html/css 两个div在同一行
在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...
- 【css flex】将多个<div>放在同一行
使用style里的flex属性 默认情况下,一个div独占一行 使用css选择器给外层div加上以下flex属性,则该div的子div可以在同一行中显示, .runs-paginator-flex-c ...
- css:多个div在同一行显示
使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示. 示例如下: <div class="search_row"& ...
- 让div排成一行===>inline-block的兼容性
行内元素,排列在一行,但是不能设置它的width.height.margin.padding属性,即使设置了,也是不生效的. 快元素独占一行,如下的这个例子,before div.in div1.in ...
- CSS学习笔记--Div+Css布局(div+span以及盒模型)
1.DIV与SPAN 1.1简介 1.DIV和SPAN在整个HTML标记中,没有任何意义,他们的存在就是为了应用CSS样式 2.DIV和span的区别在与,span是内联元素,div是块级元素 内联元 ...
- 排成一行的li之间的间隙问题
现象 对于ul下li排成一行的布局(即li的display由list-item设为inline-block): 情况1 如果这些li在书写的时候有换行或者有空格,且ul本身的font-size不为0, ...
- CSS + ul li 横向排列的两种方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 通过设置CSS属性让DIV水平居中
通过设置CSS属性让DIV水平居中 ---------------------- <html> <head> <title></title> <m ...
- DIV+CSS常见问题:DIV如何设置一个像素高度?
CSS如何控制DIV实现1像素高度呢?问题看起来很简单,但万恶的IE6会让你很麻烦,不过解决办法很多,本文将介绍最简单的一种:DIV{height:1px;line-height:1px;font-s ...
随机推荐
- 【题解】 bzoj2115: [Wc2011] Xor (线性基+dfs)
bzoj2115,戳我戳我 Solution: 看得题解(逃,我太菜了,想不出这种做法 那么丢个链接 Attention: 板子别写错了 又写错了这次 \(long long\)是左移63位,多了会溢 ...
- 自学huawei之路-AC6005-8AP添加授权码
返回自学Huawei之路 自学huawei之路-AC6005-8AP添加授权码
- hdu5583
#include <stdio.h> #include <stdlib.h> #include <string.h> #include <math.h> ...
- json字符串和Json对象,以及json的基本了解
考虑到python等语言中没有更好表示json对象的方法,所以使用JavaScript来介绍json 首先是json字符串: var str1 = '{ "name": " ...
- 什么是spu和sku
电商概念SPU与SKU SPU = Standard Product Unit (标准产品单位)SPU是商品信息聚合的最小单位,是一组可复用.易检索的标准化信息的集合,该集合描述了一个产品的特性.通俗 ...
- poj 2438 Children's Dining
http://poj.org/problem?id=2438 题意: 有2*N个人要坐在一张圆桌上吃饭,有的人之间存在敌对关系,安排一个座位次序,使得敌对的人不相邻. 假设每个人最多有N-1个敌人.如 ...
- bzoj千题计划208:bzoj3174: [Tjoi2013]拯救小矮人
http://www.lydsy.com/JudgeOnline/problem.php?id=3174 按a+b从小到大排序,a+b小的在上面,先考虑让它逃出去 正确性不会证 感性理解一下,最后一个 ...
- H5 Day1 练习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [整理]WebAPI中应用oData
http://www.odata.org/ http://bitoftech.net/category/odata/ http://www.hanselman.com/blog/CreatingAnO ...
- java Runnable、Callable、FutureTask 和线程池
一:Runnable.Callable.FutureTask简介 (1)Runnable:其中的run()方法没有返回值. ①.Runnable对象可以直接扔给Thread创建线程实例,并且创建的线程 ...