Home > Web Front-end > HTML Tutorial > I would like to ask an expert, how to set individual styles for many paragraphs? _html/css_WEB-ITnose

I would like to ask an expert, how to set individual styles for many paragraphs? _html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:21:00
Original
2054 people have browsed it

Hello everyone, I would like to ask, I have a paragraph of text, there are many



I now set a separate class for the first

, using the first-child method Let's set the first

.

But now I want to set the style for the second paragraph, or all the remaining paragraphs. How to set it? What method to use.

I want to implement it like this. The style of the first p is class1, and the styles of the remaining p are all class2.

Does anyone here know how?


Reply to the discussion (solution)

p.className("class2");
Set the class separately for the first

, using first-child This method is used for the first

What about the other p? How to set the style?

content

The other p is

content

<!doctype html><html><head><meta charset="gb2312"><title>无标题文档</title><style type="text/css">p:first-child { background-color:#CCC}p { background-color:#ABC}</style></head><body><p>1</p><p>2</p><p>3</p><p>4</p></body></html>
Copy after login

because my js is To control whether all articles are displayed or only part of them, class="p_detail"







is set like this. After running, look at the source code
or


There is no


Without

, my js cannot perform some operations. Please help me upstairs. Help, I’ll give you extra points

<html><head><meta charset="gb2312"><title>无标题文档</title><style type="text/css">.p_detail { background-color:#CCC}.p_excerpt { background-color:#ABC}</style><script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script><script type="text/javascript">$(document).ready(function(e) {    $("p:first-child").addClass("p_detail")    $("p:not(:first-child)").addClass("p_excerpt")});</script></head> <body><p>1</p><p>2</p><p>3</p><p>4</p></body></html>
Copy after login
It’s not available when you look at the source code, but it’s actually there! Use firefox or chrome to view it by pressing F12.

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template