I make a local page that prints me some information. My boos want to add two different colours as a background colour. I know how to add background colour to the whole page, but I don't know how to separate the page into two different background colours. This is what my code looks like for now:
<!DOCTYPE html>
<html lang="pl">
<head>
<title>Raport Transmisji</title>
</head>
<body bgcolor=”#e6fff5">
<h1 style="text-align: center;"><strong>INSTYTUT NIEZNANY</strong></h1>
<div>
<h1 style="text-align: center;"><strong>DANE PRZYPADKOWE</strong></h1>
<div>
<h3 style="text-align: center;">ZAKŁAD NIEZNANY</h3>
<div>
<div style="text-align: center;">ul. Kozłowska 20, tel. 123-456-789 </div>
<p style="text-align: center;">RAPORT TRANSMISJI DANYCH DO ## z dnia <span style="color: #ff0000;">(data)</span></p>
<p style="text-align: center;">DO PRZEBIEGU OBLICZEŃ <span style="color: #ff0000;">(liczba)</span>/<span style="color: #ff0000;">(liczba)</span></p>
<hr />
<p>Łączna liczba zwierząt w aktualnej transmisji - <span style="color: #ff0000;">(liczba)</span></p>
<hr />
<p>CZYSTORASOWE:</p>
<p style="text-align: justify; padding-left: 80px;">WBP - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<p style="text-align: justify; padding-left: 80px;">PBZ - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<p style="text-align: justify; padding-left: 80px;">Puławska - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<p style="text-align: justify; padding-left: 80px;">Hampshire - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<p style="text-align: justify; padding-left: 80px;">Duroc - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<p style="text-align: justify; padding-left: 80px;">Pietrain - (razem/knurki/loszki) - (liczba)/(liczba)/(liczba)</p>
<hr />
<p>MIESZAŃCE:</p>
<p style="padding-left: 40px;">Mieszańców z rasą WBP - liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to WBP(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to WBP(razem/knurki/loszki - liczba/liczba/liczba</p>
<p style="padding-left: 40px;"> </p>
<p style="padding-left: 40px;">Mieszańców z rasą PBZ- liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to PBZ(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to PBZ(razem/knurki/loszki - liczba/liczba/liczba</p>
<p style="padding-left: 40px;"> </p>
<p style="padding-left: 40px;">Mieszańców z rasą Puławską- liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to Puławska(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to Puławska(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;"> </p>
<p style="padding-left: 40px;">Mieszańców z rasą Hampshire- liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to Hampshire(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to Hampshire(razem/knurki/loszki - liczba/liczba/liczba</p>
<p style="padding-left: 40px;"> </p>
<p style="padding-left: 40px;">Mieszańców z rasą Duroc- liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to Duroc(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to Duroc(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;"> </p>
<p style="padding-left: 40px;">Mieszańców z rasą Pietrain- liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa ojca to Pietrain(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p style="padding-left: 40px;">Mieszańców gdzie rasa matki to Pietrain(razem/knurki/loszki) - liczba/liczba/liczba</p>
<p> </p>
<p style="text-align: justify;font-size: 12px">DONICE, DNIA .............. ...................</p>
<p style="font-size: 10px; padding-left: 560px;">(podpis)</p>
</body>
</html>
Every word "liczba" or "data" will be replaced in my python program. This code gives me a good-looking report but I have one colour on my whole page. I need one colour from "RAPORT TRANSMISJI DANYCH DO ## z dnia" to "Pietrain - (razem/knurki/loszki) - (liczba)(liczba)(liczba)" included this both lines. Second colour from "MIESZAŃE" to "Mieszańców gdzie rasa matki to Pietrain(razem/knurki/loszki) - liczba/liczba/liczba" included this both lines. Thanks for all your help.
CodePudding user response：
you can use two different div class and use style in particular div. That's it. Thanks.