css ul li 水平布局问题
可以有俩种方法,暂时只用float:left; 找到每一个li进行水平浮动
#hd_nav li{
border-right: 1px solid rgba(255,255,255,0.2);
float: left;
height: 14px;
padding: 0 10px;
}
border-right 向又 1px 添加一条实线 并添加颜色。
值得一说的是 rgba(0,0,0,0) 其实就是rgb +ALPHA 进行设置颜色 和透明度 。最后一个参数1的时候为实线 0是完全透明。 参数可以再0-1之间进行设置。
rgba 在ie8 及以下的浏览器不支持透明效果,显示依然为实线 ,为了解决兼容性的问题,我们可以这样做;
DIV{
color: rgb(127, 127, 127);
color: rgba(0, 0, 0, 0.5);
}
当浏览器不支持的时候显示的是rgb 当支持的时候用的是rgba()
css ul li 水平布局问题的更多相关文章
- CSS + ul li 横向排列的两种方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- css ul li 制作导航条
<html> <head> <style> .test ul{list-style:none;} .test li{float:left; width:100px; ...
- CSS ul li a 背景图片与文字对齐
<div class="four"> <h2>电子商务</h2> <img src="images/photo2.gif&quo ...
- css ul li 横向排列
因为li是块级元素,默认占一行的,要想实现横向排列,一般通过以下两个方法:float:left这样设置有一个问题,li浮动以后则脱离了文本流,即不占位置,如果它的父级元素有具体的样式且没有固定宽高,建 ...
- DIV+CSS布局重新学习之css控制ul li实现2级菜单
竖状菜单: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- css控制UL LI 的样式详解
用<ul>设置导航 <style> #menu ul {list-style:none;margin:0px;} #menu ul li {float:left;} </ ...
- div+css(ul li)实现图片上文字下列表布局
css样式表代码: html布局代码: 效果图: html布局部分,可根据自己需要添加对应的div即可. 1.CSS关键样式单词解释 1).ul.imglist{ margin:0 auto; wid ...
- li 水平排列并自动填满 ul
找了li 如何水平排列并自动填满 ul,同时 li 宽度平均?资料,里面有提到"请用js动态计算保证兼容性", 因为我想实现的是,水平滚动条,ul的上级div是固定的宽度1000p ...
- css案例学习之table tr th td ul li实现日历
效果 代码 <html> <head> <title>Calendar</title> <style> <!-- .month { b ...
随机推荐
- POJ 3009 Curling 2.0 回溯,dfs 难度:0
http://poj.org/problem?id=3009 如果目前起点紧挨着终点,可以直接向终点滚(终点不算障碍) #include <cstdio> #include <cst ...
- Zooming MKMapView to fit annotation pins
http://stackoverflow.com/questions/4680649/zooming-mkmapview-to-fit-annotation-pins - (MKCoordinateR ...
- SGU 140 扩展欧几里得
题目大意: 给定序列a[] , p , b 希望找到一个序列 x[] , 使a1*x1 + a2*x2 + ... + an*xn = b (mod p) 这里很容易写成 a1*x1 + a2*x2 ...
- android之DOM生成与解析
DOM解析不适合于进行大数据文件的操作,DOM解析适合于对文件进行修改和随机存取的操作. DOM生成 //判断一下是否存在sdcard if(!Environment.getExternalStora ...
- git命令学习用
- C# CsvFile 类
using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Tex ...
- 用命令 安装/卸载 windows服务(转)
第一种方法: 1. 开始 ->运行 ->cmd 2. cd到C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727(Framework版本号按IIS配置 ...
- 2013年9月份第2周51Aspx源码发布详情
休闲农庄企业站源码 2013-9-13 [VS2008]功能介绍: 首页功能:关于我们 资讯中心 休闲娱乐 餐饮娱乐 环境展示 园林展示 交通指引 联系我们 后台功能: 基本信息:服务 ...
- Stm32_调试出现 Error:Flash Download Failed-"Cortex-M3"
rror:Flash Download Failed-"Cortex-M3"出现一般有两种情况: 1.SWD模式下,Debug菜单中,Reset菜单选项(Autodetect/HW ...
- WPF 中动态创建、删除控件,注册控件名字,根据名字查找控件
动态创建控件 1.容器控件.RegisterName("Name",要注册的控件) //注册控件 2.容器控件.FindName("Name") as 控 ...