cssli的样式,css基本样式
怎样才能用css控制第一个li标签的样式,和其他li的样式不同
css控制第一个li标签的样式,和其他li的样式不同:给第一个li标签添加class或者id,然后编写css代码。
十年的新河网站建设经验,针对设计、前端、开发、售后、文案、推广等六对一服务,响应快,48小时及时工作处理。成都营销网站建设的优势是能够根据用户设备显示端的尺寸不同,自动调整新河建站的显示方式,使网站能够适用不同显示终端,在浏览器中调整网站的宽度,无论在任何一种浏览器上浏览网站,都能展现优雅布局与设计,从而大程度地提升浏览体验。成都创新互联从事“新河网站设计”,“新河网站推广”以来,每个客户项目都认真落实执行。
html:给第一个li元素添加一个class类名为“menu1”。
html:
ul
li class=“menu1”新闻一/li
li新闻二/li
li新闻三/li
/ul
css代码:
li{font-size:14px;} //4px大小的字体
.menu1{font-size:18px;font-weight:bold;} //字体样式:粗体18px字体
效果:
怎样定义《li》标签的css样式呢?
你自己看看它的CSS。学一学。
body,p,dl,dd,table,td,th,input,img,form,div,ul,li{margin:0;padding:0;}
body{max-height:100%;TODO:height:100%;background:#FFFFFF url(../images/chunjie/bg.gif) repeat-x fixed top;background-
attachment:scroll;font-size:14px;margin:auto;font-family:"??ì?";text-align:center;}
img,iframe{border:none;}
ul,li,ol{list-style:none;}
img,input,label,span{vertical-align:middle;}
table{border-collapse:collapse;border-spacing:0;}
a:link,a:visited{text-decoration:none;color:#000;}
a:hover{text-decoration:underline;color:#F00;}
#main{width:990px;margin:0 auto;border-top:0;}
#header{margin-bottom:5px;}
#aside{float:left;width:220px;background:url("../images/line.gif");}
#content{margin-left:-220px;width:765px;float:right;}
.usrbar{height:22px;border:1px solid #DAE9F7;background:#F0F7FF;font-size:13px;line-height:22px;}
.usrbar table{width:100%;color:#666;}
.usrbar td{text-align:left;}
.usrbar a:link,.usrbar a:visited{color:#666;}
#Forecast{margin-left:20px;}
.mail{text-align:left;height:70px;border-bottom:3px solid #7fd479;font-size:12px;}
.mail table{height:100%;}
.mail table tr{line-height:22px;}
.nav{border-top:1px solid #3CB738;padding-top:12px;text-align:left;}
.ns td{font-size:13px;width:55px;border-right:3px solid #FCFFF7;background:#E8ECE8;text-align:center;line-
height:18px;cursor:pointer;}
.ns .clean{background:#FCFFF7;cursor:auto;}
.ns .cur{background:#38B830;font-weight:bold;color:#F8FCF0;}
.ns a:link,.ns a:visited{color:#687070;}
.ns dl{line-height:14px;height:14px;vertical-align:middle;cursor:pointer;border:1px solid #fff;}
.ns dt{float:right;background:url("../images/dropdown.gif");width:14px;height:14px;}
.ns dd{float:left;margin-left:3px;}
.sch{width:100%;border:1px solid #78D470;background:url("../images/line.gif");height:48px;text-align:left;font-size:13px;}
.bottom th input,.sch input{height:1.40em;width:355px;font-size:16px;padding-left:2px;padding-top:3px;}
.bottom th button,.sch button{height:2.3em;width:6.8em;font-size:14px;line-height:2.0em;}
#aside table{margin:8px 0 0 10px;}
#aside th{text-align:left;height:30px;}
#aside th a:link,#aside th a:visited{color:#3DB836;}
#aside td{width:50px;height:31px;text-align:left;}
.hot{width:100%;}
.hot td{width:16.6%;height:30px;}
.middle{font-size:12px;line-height:19px;border-left:2px solid #7BD676;border-right:2px solid #7BD676;}
.middle a:link,.middle a:visited{color:#083C80;}
.sort{height:550px;}
.sort th,.sort td{font-size:13px;height:24px;line-height:24px;*line-height:23.5px;border-bottom:1px solid #FCFFF7;;border-
right:1px solid #FCFFF7;}
.sort th a:link,.sort th a:visited{color:#874604;}
.sort a{margin-left:20px;zoom:1;}
.sort .s_widen a{margin-left:28px;zoom:1;}
.sort .s_big_widen a{margin-left:35px;zoom:1;}
.bottom .pa1 b a,.bottom .pa2 b a,.bottom .pa3 b a{margin:0;}
.sort b a,.sort th a{margin:0;}
.sort th,.sort b{font-style:normal;font-weight:normal;margin:0;}
.bg1{background:#FFF8F0;}
.bg2{background:#F0F7FF;}
.bottom{text-align:left;}
.bottom p{margin-left:20px;line-height:24px;font-size:13px;}
.bottom .pa1 a{margin-right:18.5px;zoom:1;}
.bottom .pa2 a{margin-right:15px;zoom:1;}
.bottom .pa3 a{margin-right:14px;zoom:1;}
.bottom .pa1 b a,.bottom .pa2 b a,.bottom .pa3 b a{margin:0;}
.bottom a:link,.bottom a:visited{color:#205001;}
.bottom table{width:100%;background:#F0F7FF;border-top:1px solid #DAE9F7;line-height:42px;height:42px;padding-
left:40px;padding-top:5px;}
.bottom button{margin-left:10px;vertical-align:middle;}
.bottom th input{width:260px;vertical-align:middle;font-size:16px;padding-left:2px;}
.bottom th{font-weight:normal;padding-left:20px;}
.bottom td{width:77px;color:#205001;}
.bottom td input{margin-bottom:3px;margin-right:3px;}
#footer{font-size:13px;vertical-align:middle;margin:10px 0;line-height:24px;}
#footer img{vertical-align:auto;}
.div_border{border:2px solid #7BD676;}
.clear{clear:both;}
a.f1:link,a.f1:visited{color:#F85050;}
a.f2:link,a.f2:visited{color:#108410;}
a.f3:link,a.f3:visited{color:#FF3D14;}
.bottom a:hover,.sort th a:hover,#aside th a:hover,.usrbar a:hover,.middle a:hover,a.f1:hover,a.f2:hover{color:#f00;}
#hao_mail_options{width:174px;}
#hao_mail_username{width:168px; padding-left:2px}
#hao_more_popup{position:absolute;float:left;z-index:65536;width:58px;border:1px solid #B0BEC7;text-
align:left;background:#fff;margin-top:3px;}
#hao_more_popup li{line-height:20px;}
#hao_more_popup a{color:#000;text-decoration:none;display:block;padding-left:3px;}
#hao_more_popup a:hover{color:#fff;background:#316AC5;}
#hao_my_like,#hao_my_site{display:none;text-align:left;line-height:24px;border:1px solid #DDDDC5;background:#F9F9ED;font-
size:13px;padding-left:10px;}
#hao_my_like a,#hao_my_site a{color:#444;margin-left:10px;}
#sugOut{position:relative;}
#sug{position:absolute;float:left;left:0;top:0;border:1px solid #817F82;display:none;-moz-user-select:none;z-index:1001;}
#sug td{line-height:22px;height:22px;padding-left:3px;font:14px verdana;}
.mo td{background-color:#36c;color:#fff;}
.ml td{border:0 solid #fff;background-color:#fff;color:#000;}
#sug_t a:link,#sug_t a:visited,#sug_t a:hover{text-decoration:none;font-size:14px;color:#000;width:100%;display:block;}
.ft18{font-size:14px;}
css控制ul标签下li样式
在ul标签下li的默认样式为一个实心圆(disc) 可忽略不写
li样式的改变是用 list-style:属性值 来改变的
我们给li设置css,去除默认样式(实心圆)
将li的样式设置为空心圆
将li的样式设置为实心正方形
其他:
decimal : CSS1 阿拉伯数字
lower-roman : CSS1 小写罗马数字
upper-roman : CSS1 大写罗马数字
lower-alpha : CSS1 小写英文字母
upper-alpha : CSS1 大写英文字母
armenian : CSS2 传统的亚美尼亚数字
cjk-ideographic : CSS2 浅白的表意数字
georgian : CSS2 传统的乔治数字
lower-greek : CSS2 基本的希腊小写字母
hebrew : CSS2 传统的希伯莱数字
hiragana : CSS2 日文平假名字符
hiragana-iroha : CSS2 日文平假名序号
katakana : CSS2 日文片假名字符
katakana-iroha : CSS2 日文片假名序号
lower-latin : CSS2 小写拉丁字母
upper-latin : CSS2 大写拉丁字母
css样式修改li水平显示
将li的样式设置成以下例子:display:inline;line-height:24px;height:auto;word-break:break-all;word-wrap : break-word ;可以修改一下,到适合你的要求。
CSS li的图片样式
1、css li的图片样式:liimg src="" class="img"/li
2、样式: .img{width:100px; height:100px; background:#f00;}
css样式中的li
表示和当前li同级的所有li标签。不包括父级li和子级li。
另外常用的还有lili:这个表示当前li的子级li标签。
本文题目:cssli的样式,css基本样式
URL地址:http://ybzwz.com/article/phiccj.html