社区
community_281
帖子详情
CSDN搜索有待改进啊
devin_jia
2010-10-25 05:13:28
想要什么东西在SCDN上都搜不到,在百度上面搜又能看见CSDN的身影,真老火。工作的机器又只能上CSDN。什么时候CSDN搜索能智能点啊......
...全文
120
16
打赏
收藏
CSDN搜索有待改进啊
想要什么东西在SCDN上都搜不到,在百度上面搜又能看见CSDN的身影,真老火。工作的机器又只能上CSDN。什么时候CSDN搜索能智能点啊......
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
16 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
The_End_Of_The_World
2010-10-26
打赏
举报
回复
不姓贾_请叫我甄先生
2010-10-26
打赏
举报
回复
[Quote=引用 1 楼 cxz003 的回复:]
人都跑光了 怎么改进啊
[/Quote]顽固消息还是挺灵通的
KingNE
2010-10-26
打赏
举报
回复
慢慢改
jia_214535968
2010-10-26
打赏
举报
回复
在<head>与</head>之间加上<style>li{float:left;}</style>就可以了
jia_214535968
2010-10-26
打赏
举报
回复
一、清除缩进和项目符
1、清除项目符和缩进:ul {list-style: none; padding-left:0px;}
2、清除缩进 ul {margin:7;list-style-type:disc;}
3、清除缩进 ul {margin-left:20px}
4、清除缩进 ul {margin-left: -24px;}
二、更换项目符漂亮小图标
下面有3种实现方法:
1、简单方法
ul{list-style-image:url(/images/icon.gif);}
这种方法不同的浏览器的显示效果会有一些差异,主要是在图片的垂直位置上。有些浏览器会使图片和列表项文本的中部位置平齐,有的又会显示得高一些,总之就是有些不一致。
2、复杂方法
ul {list-style:none;}
li{background: url(/images/icon.gif) no-repeat 0px 50%; padding-left:17px;}
可以解决上面的浏览器不兼容的问题。首先,清除默认的项目符号,然后加上我们自己的背景图片。no-repeat告诉浏览器不要平铺这张图片,0px 50%告诉背景图片应该位于距左侧0px 且竖直方向位于顶部往下50%处,实际上就是在竖直方向居中。我们在左侧加上了17px的边距,这样那些15px宽5像素高的小图标就能完全显露出来,不会被文本遮挡,并且和文本之间有一点间隔。
3、常规方法
li {background: url(/images/icon.gif) no-repeat 0px 50%; padding-left:17px;}
三、更换项目符为小方块
ul {list-style-type: square;}
list-style-type可以有以下取值:
取值:disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | lower-alpha | upper-alpha | none | inherit
disc:点
circle: 圆圈
square: 正方形
decimal: 数字
decimal-leading-zero: 以一个0开头的数字e.g., 01, 02, 03, ..., 98, 99
lower-roman: 小写罗马文字i, ii, iii, iv, v, /etc.
upper-roman: 大写罗马文字I, II, III, IV, V, /etc.
lower-greek: 小写阿拉伯文字α, β, γ, ...
lower-latin: 小写拉丁文a, b, c, ... z
upper-latin: 大写拉丁文A, B, C, ... Z
armenian: 亚美尼亚数字
georgian: 乔治亚数字an, ban, gan, ..., he, tan, in, in-an, ...
lower-alpha: 小写拉丁文a, b, c, ... z
upper-alpha: 大写拉丁文A, B, C, ... Z
none: 无(取消所有的list样式)
inherit:继承
四、行列排法
1、默认为纵向横向,无须设定。
2、横向排列,对<li>设定左对齐:li{float:left; }
2、多行多列排列:一是设定<li>左对齐:li{float:left; };二是确定<ul>的宽度和<li>的宽度;一个<li>是一列,第一排横<li>个数之和等于<ul>的宽度。
五、<li>与<ul>浏览器兼容
兼容浏览器 在CSS中加:
list-style-position: outside;
六、<li>与<ul>列表应用实例
1、用无序列表(<li>)也可以代替表格(<table>)制作横向的导航列表
html代码
<ul id="minitabs">
<li><a href="/" >网站</a></li>
<li><a href="http://blog.liugongwei.cn/admin.php#" >我的博客</a></li>
<li><a href="/star.php">精华文章</a></li>
<li><a href="/links.php">友情链接</a></li>
</ul>
CSS代码
jia_214535968
2010-10-26
打赏
举报
回复
html代码
<ul id="minitabs">
<li><a href="/" >网站</a></li>
<li><a href="http://blog.liugongwei.cn/admin.php#" >我的博客</a></li>
<li><a href="/star.php">精华文章</a></li>
<li><a href="/links.php">友情链接</a></li>
</ul>
CSS代码
#minitabs{
height:29px;
font-size:12px;
margin:0px;
padding:0px;
border-bottom:1px solid #696;
}
#minitabs li {
height:25px;
margin:0px;
padding:0px;
display:inline;
list-style-type:none;
}
#minitabs a {
float:left;
line-height:25px;
font-weight:bold;
margin:0px 10px 0px 10px;
text-decoration:none;
color:#9c9;
}
#minitabs a.active, #minitabs a:hover {
border-bottom:4px solid #696;
color:#363;
}
#minitabs a:hover {
color:#696;
}
我们这里实际做的是去掉了项目符号以及默认的缩进。display:inline;把列表变成水平方向。我们还让列表中所有a元素 float:left; 实际上就是强制它们在水平方向对齐成一行。我们还加上了一些颜色,让链接文本以粗体显示,并且去掉了链接默认的下划线。
2、行列排法100排十行十列
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>1到100 利用CSS+ul+li 排列成十行十列</title>
<style type="text/css">
#mainDiv{
width:490px;
padding:10px;
background-color:#ccc;
overflow:hidden;
}
ul{
list-style:none;
padding:0;
margin:0;
}
li{
width:48px;
float:left;
margin:-1px 0 0 -1px;
border:1px solid #333;
text-align:center;
}
</style>
</head>
<body>
<div id="mainDiv">
<ul>
<script type="text/javascript">
var i;
for(i=1;i<=100;i++){
document.write("<li>" + i + "</li>");
}
</script>
</ul>
</div>
</body>
</html>
中间用了段js代替。纯CSS用下面的代码替换<script type="text/javascript"> <ul>……</script> </ul>就可以了。
<ul>
<li>1</li>
<li>2</li>
...
<li>100</li>
</ul>
devin_jia
2010-10-25
打赏
举报
回复
[Quote=引用 1 楼 cxz003 的回复:]
人都跑光了 怎么改进啊
[/Quote]
我也不知道什么意思
weaponNEKing
2010-10-25
打赏
举报
回复
还能用?
dong918
2010-10-25
打赏
举报
回复
[Quote=引用 3 楼 xming4321 的回复:]
引用 1 楼 cxz003 的回复:
人都跑光了 怎么改进啊
[/Quote]
??
Raul_Gonzalez
2010-10-25
打赏
举报
回复
不大姨妈就不错了...
StillMiss
2010-10-25
打赏
举报
回复
[Quote=引用 3 楼 xming4321 的回复:]
引用 1 楼 cxz003 的回复:
人都跑光了 怎么改进啊
[/Quote]
????
十一文
2010-10-25
打赏
举报
回复
[Quote=引用 1 楼 cxz003 的回复:]
人都跑光了 怎么改进啊
[/Quote]
十一文
2010-10-25
打赏
举报
回复
顽固已死_有事烧纸
2010-10-25
打赏
举报
回复
人都跑光了 怎么改进啊
CSDN
APP
搜索
工具使用体验与对比
本文对比分析了
CSDN
、稀土掘金、极客时间、知乎、简书等APP的
搜索
功能,包括首页布局、
搜索
页面设计、关键词输入过程、
搜索
结果页面、内容展现及内容质量。发现各APP在
搜索
栏设计、历史
搜索
、热榜、内容摘要等方面各有特点,但也
有待
改进
之处,如
CSDN
的
搜索
结果页面布局、知乎的
搜索
栏位置、简书的摘要展示等。此外,对于移动端
搜索
,用户更依赖平台推送,内容筛选和摘要质量显得尤为重要。建议增加关键词匹配、优化摘要显示,并考虑移动端阅读体验的适配性。
最实用的Chrome插件
博主分享了安装与使用
CSDN
开发助手插件的体验,详细描述了安装过程中的问题及解决办法。插件的个性化标签、万能
搜索
框和实用快捷工具等功能受到好评,但指出在人机交互和快捷键设置方面
有待
改进
。建议增加更多程序员友好功能,并提出将资讯页面替换为音乐的建议。
公告:
CSDN
搜索
第二版正式上线!
CSDN
搜索
系统更新,采用Lucene实现全文索引,覆盖论坛、博客等内容,
改进
包括实时索引、分词准确度及排序规则等。
超实用的浏览器插件:
CSDN
全站去广告
本文介绍了
CSDN
官方插件的功能与使用体验,包括快速浏览界面、全站免广告、快捷C键
搜索
及JSON格式化等特性,并提出了
改进
建议。
CSDN
如何
搜索
自己的博客;使用Google
搜索
自己的博客
本文探讨了在
CSDN
博客平台中
搜索
个人文章时遇到的问题,并分享了一个实用的解决方案——利用Google
搜索
引擎配合特定语法来精确查找自己的博客内容。此外,还提出了
CSDN
平台在用户体验方面需要
改进
的地方。
community_281
700
社区成员
253,700
社区内容
发帖
与我相关
我的任务
community_281
提出问题
复制链接
扫一扫
分享
社区描述
提出问题
其他
技术论坛(原bbs)
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章