新闻css样式,css新闻页面制作
css中 如何把新闻这一行变成绿色? 为什么添加active {background-color:#afc; }之后
方法一、把.active加到li标签
成都创新互联是一家专注于成都网站制作、成都做网站与策划设计,昭苏网站建设哪家好?成都创新互联做网站,专注于网站建设10年,网设计领域的专业建站公司;建站业务涵盖:昭苏等地区。昭苏做网站价格咨询:13518219792
li.active{background-color:#afc;}
方法二、把a标签设置属性display;
a{display:block;width:100%;}
css样式中,怎么让新闻列表的时间总是在右边
其实关键就是如楼上所说的:float:right这句,下面给个例子供你参考一下:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
title无标题文档/title
style type="text/css"
#pagelist{
border:4px solid #ccc;
padding:10px;
width:530px;
font-size:12px;
list-style-type:none;
float:right;
}
#pagelist li{
width:530px;
height:30px;
border-bottom:1px dashed #CCCCCC;
margin:0px;
padding:0px;
/*background:#99FFCC;*/
}
#pagelist li a .lbt{
display:block;
width:433px;
float:left;
line-height:30px;
text-indent:5px;
text-decoration:none;
white-space:nowrap; /*强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象*/
text-overflow:ellipsis; /*当对象内文本溢出时显示省略标记(...)*/
overflow:hidden;
display:inline;
}
#pagelist li a .ldt{
display:block;
width:75px;
float:right;
text-align:center;
line-height:30px;
color:#069;
text-decoration:none;
display:inline;
}
#pagelist li a{
width:530px;
height:30px;
display:block;
color:#666;
text-decoration:none;
cursor:hand;
}
#pagelist li a:hover{
color:#03c;
text-decoration:none;
border-bottom:1px dashed #000000;
}
#pagelist li a:hover #com{
display:block;
float:left;
width:0px;
height:0px;
margin:4px 0 4px 6px;
border-bottom:8px solid #FFFFFF;
border-left:8px solid #FF0000;
border-top:8px solid #FFFFFF;
}
#pagelist li a:hover .ldt{
color:#000;
}
/style
/head
body
ul id="pagelist"
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字标题的文字标题的文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字标题的文字标题的文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字标题的文字标题的文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题/spanspan class="ldt"2007-08-06/span/a/li
lia href="#"span id="com"/spanspan class="lbt"这里是相关文字标题的文字这里是相关文字标题的文字字/spanspan class="ldt"2007-08-06/span/a/li
/ul
/body
/html
我想把原有的CSS样式里的新闻标题加上H1标签应该要怎样改,代码如下
#boxNews #title{ text-align:center; font-size:14px; font-weight:bold; color:#749702;}可以把这里的#title直接换成h1,然后你页面里写成
div id="boxNews"
h1标题/h1
/div
就可以了
如何设置CSS样式使网页中过长的新闻标题后面以省略号显示
前提是要固定宽度,如下
li style="width:50px; overflow:hidden;white-space:nowrap;text-overflow:ellipsis;"如何设置CSS样式使网页中过长的新闻标题后面以省略号显示/li
而在样式中加上 overflow:hidden;white-space:nowrap;text-overflow:ellipsis; 这段代码的意思是超出50px的长度后,后面以省略号显示。
请问这种样式用CSS怎么写,新闻是用h2样式写的,右边的更多怎么做出来啊,怎么做他都是在h2下面啊。急急急
h2是一个层标签,所以他的宽是100%,所以写在后面的元素会另起一行。要做到并排,就要限制h2的宽。
div
h2 style=“width:100px”新闻/h2/span
span style="float:right"a href="#"更多/a/span
/div
求助:用CSS做有个新闻内容的样式表
分太少 真不值得浪费时间
td,br,input,select{font-family:ms shell dlg; font-size:9pt; line-height:150%}
p{font-size:14px;line-height:160%}
A:visited {color:#000000; text-decoration:none}
a:hover {color: #0033cc; text-decoration:underline}
a:link { color: #000000; text-decoration:none}
.white {color:#fff; font-size:14px;font-weight:bold; line-height:150%}
.black {color:#000; font-size:14px;font-weight:bold; line-height:150%}
.blue2:visited {color:#C1E0FF; text-decoration:none; font-size:14px;}
.blue2:hover {color: #ffffff; text-decoration:underline; font-size:14px;}
.blue2:link { color: #C1E0FF; text-decoration:none; font-size:14px;}
a.awhite{color:fff}
A.awhite:visited {color:fff; text-decoration:none; }
a.awhite:hover {color: #ccffff; text-decoration:underline; }
a.awhite:link { color: #fff; text-decoration:none;}
.link:visited {color:#ffffff; text-decoration:none; font-size:14px; font-weight:bold;}
.link:hover {color: #ffffff; text-decoration:underline; font-size:14px; font-weight:bold;}
.link:link {color: #ffffff; text-decoration:none; font-size:14px; font-weight:bold;}
.curpostitle:visited {color:#000000; text-decoration:none; font-size:14px; font-weight:bold;}
.curpostitle:hover {color: #ff6600; text-decoration:underline; font-size:14px; font-weight:bold;}
.curpostitle:link {color: #000000; text-decoration:none; font-size:14px; font-weight:bold;}
.tulink:visited {color:#ffffff; text-decoration:none; font-size:14px;}
.tulink:hover {color: #ffffff; text-decoration:underline; font-size:14px;}
.tulink:link { color: #ffffff; text-decoration:none; font-size:14px;}
.blank:visited {color:#000000; text-decoration:none;font-weight:bold;}
.blank:hover {color: #ffffff; text-decoration:none;font-weight:bold;}
.blank:link { color: #000000; text-decoration:none;font-weight:bold;}
.news:visited {color:#000000; text-decoration:none; font-size:14px;}
.news:hover {color: #666666; text-decoration:underline; font-size:14px;}
.news:link { color: #000000; text-decoration:none; font-size:14px;}
.blue:visited {color:#003366; text-decoration:none;font-weight:bold;}
.blue:hover {color: #CC3300; text-decoration:none;font-weight:bold;}
.blue:link { color: #003366; text-decoration:none;font-weight:bold;}
.bigblue{color:#013f88;font-size:14px;font-weight:bold;}
.wipt {WIDTH: 162px}
.tuwhite{color:#ffffff;font-size:12px;font-weight:bold;}
.ArticleTitle{font-size:18px;color:#013f88;font-weight:bold;}
.ArticleContent{font-size:14px;line-height:180%}}
.ListNewClass{background-image:url('../cfs_images/dot.gif');height:18}
.ListColumnClass{background-image:url('../cfs_images/dot.gif');height:18}
.ListRecClass{background-image:url('../cfs_images/dot.gif');height:18}
.TitleClass{font-family:ms shell dlg; font-size:9pt; line-height:150%}
.TitleClass2:visited {color:D8EDFB; text-decoration:none;font-family:ms shell dlg; font-size:9pt; line-height:150%}
.TitleClass2:hover {color: #ccffff; text-decoration:underline; font-family:ms shell dlg; font-size:9pt; line-height:150%}
.TitleClass2:link { color: #D8EDFB; text-decoration:none;font-family:ms shell dlg; font-size:9pt; line-height:150%}
分享题目:新闻css样式,css新闻页面制作
文章起源:http://myzitong.com/article/dscccih.html