CSS 文本放置
有人知道我如何才能在新闻链接的标题下方显示“作者于 2010 年 4 月 3 日发布 | 0 条评论”,而不将其排除在 A 类之外吗?我希望它的外观、阅读和功能类似于:
[IMAGE] HEADLINE
Posted by AUTHOR on April 3rd, 2010 | 0 Comments
所有这些都在初始查看字段中,然后用户可以单击并进一步扩展。如果我把它放在 A CLASS 标签中,显然我可以让它工作,但这就是问题所在。我不能把它放在那里。
编辑:忘记向你们展示我目前正在尝试用这个创建什么; http://www.notedls.com/demo
Anyone know how I can get "Posted by AUTHOR on April 3rd, 2010 | 0 Comments" underneath the headline of the news links WITHOUT it being apart of the A CLASS? I want it to look, read, and function like:
[IMAGE] HEADLINE
Posted by AUTHOR on April 3rd, 2010 | 0 Comments
All of that in the initial looking field, then the user can click and it expands further. I can obviously get it to work if I put it in the A CLASS tag, but that's the problem. I can't have it there.
EDIT: Forgot to show you guys what I'm currently trying to create with this; http://www.notedls.com/demo
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
很难说没有看到标记,但是这个 css2 选择器模式匹配规范 可能帮助你。您可以使用同级、子级、后代选择器。
另外,您可以尝试 DL/DD/DT html 元素:
我没有任何使用这些元素的经验,但我的理解是它们的渲染效果与您发布的示例类似。
请访问 DL 查看它们,< a href="http://msdn.microsoft.com/en-us/library/ms535234(v=VS.85).aspx" rel="nofollow noreferrer">DD,DT 和 w3 网站
Hard to say without seeing the markup, but this css2 selector pattern matching spec might help you. You can use sibling, child, descendant selectors.
Also, you may try the DL/DD/DT html elements:
I don't have any experience using those elements, but my understanding is that they render similar to the example you posted.
Check them out at DL, DD, DT and on the w3 site
我看到您已经有一条规则来定位包含附加文本的 div:其
ul#acc1 >力> div
的内边距为 65px,目前与您使用的图像的大小相同。但您可以轻松地增加它以获得更多缩进。另外,您可能希望从内部
和
元素中删除“宽度”规范 - 这些都是默认展开的块级元素获取他们可用的完整宽度。通过为这些指定确切的宽度,您可以冻结它们的大小,并防止它们在显示由于不同的字体大小、屏幕等而发生变化时正常流动。此外,如果您更改了某些内容的宽度或填充(就像我上面建议的那样),您将拥有无论如何都要重新计算所有宽度。使用默认的
width: auto
您不必担心这些事情。I see you already have a rule to target the div that contains the additional text: its
ul#acc1 > li > div
and has a padding of 65px, which is currently the same as the size of the images you use. But you can easily increase it to get more indentation.also, you probably want to drop the 'width' specifications from the internal
<ul>
and<li>
elements - these are all block level elements that by default expand to take the full width available to them. By specifying exact width for these you freeze their size and prevent them from flowing properly when the display changes due to different font sizes, screens, etc. Also if you ever change widths or paddings of something (like I recommend above), you will have to recalculate all the widths anyway. With the default ofwidth: auto
you don't have to worry about these things.