不同<p>标签上的不同css格式</p>

时间:2009-07-21 12:19:30

标签: asp.net html css

我正在创建一个网站,我从其他网站上读取html数据。

问题是我正在阅读的所有内容都包含<p>个标签,但我实际上想要以不同方式对其进行格式化

有没有办法让一些<p>代码使用一种格式,而某些<p>代码会在同一网页中进行其他格式化?

6 个答案:

答案 0 :(得分:8)

使用以下内容包装导入的内容:

<div class='imported'>
<p>Imported content here...</p>
<p>These paragraph tags were imported...</p>
</div>

并将其设为这样:

div.imported p {
    /* My style for imported <p>s */
}

修改在回答有关自定义<p>样式的评论时,您可以使用标准规则设置页面上的所有<p>样式:

p {
    /* Style for all <p>s */
}

然后导入的<p>更具体的规则将覆盖该规则。

修改:在回答有关内联样式的注释时,您可以使用!important覆盖它们,但这会对使用用户样式表的用户产生连锁反应。我不相信有一个干净的CSS解决方案 - 你可能最终不得不解析导入的HTML。

答案 1 :(得分:4)

是的,如果标签有不同的CSS类,例如

HTML

<p class="foo-site">This is some content lifted from Foo Site.</p>
<p class="bar-site">This is some content lifted from Bar Site.</p>

CSS

p.foo {
    /* Style for Foo Site text */
}

p.bar {
    /* Style for Bar Site text */
}

答案 2 :(得分:3)

<div class="includedContent">
<p>a paragraph</p>
</div>
<p>Another paragraph</p>

p { font-size: 8pt; }
div.includedContent p { font-size: 10pt; }

答案 3 :(得分:1)

是的,你可以给他们这样的特殊性

p:first-child { /* note this won't work in ie6 */
    border: 1px solid red;
}

p.main {
    background: pink;
}

如果您无权更改HTML,并且真的需要添加类(以使其在IE6中工作),您可以使用jQuery(请记住,没有JS的用户将看不到您的任何类这样添加了)

$('#content p:last').addClass('last');

答案 4 :(得分:0)

标记中必须有一些东西可以区分各个段落。

一个群组可能都是given class的成员,或者可能都是descendantsparticular id或某个other condition的元素。

你必须查看你的标记,看看是否有任何规则可以描述不同的段落组,并更改标记,以便在没有这样的规则时可以写入。

Selectutorial将帮助您了解可以使用的规则类型。

既然你说你是从其他网站导入HTML(我希望你小心,听起来你冒着让他们在页面中插入有害代码的风险),你应该能够将导入的代码包装在一个元素中(a div可能是最好的)你可以给一个类或一个id并使用一个后代选择器。

答案 5 :(得分:0)

您可以使用jQuery将css添加到所有偶数和奇数<p>中,如下所示:

$("p:even").css("background-color", "#bbbbff");

$("p:odd").css("background-color", "#aaaaff");