janhoedt
asked on
Pimp html report with css?
Hi,
I d like to pimp my powershell generated html report. I d hope somebody could suggest some changes to my css so it looks more professional (not a designer, more a script er myself).
Thanks!
Below the css
$HTMLHeader += @"
<BODY>
<style type="text/css">
<!--
body {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font: 10pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#report { width: 835px; }
table{
border-collapse: collapse;
border: 1px solid #FFFFFF;
font: 10pt Verdana, Geneva, Arial, Helvetica, sans-serif;
color: black;
margin-bottom: 10px;
}
table td{
border-collapse: collapse;
border: 1px solid #FFFFFF;
font-size: 14px;
padding-left: 10px;
padding-right: 10px;
}
table th {
border-collapse: collapse;
border: 2px solid ##FFFFFF;
font-size: 14px;
font-weight: bold;
padding-left: 10px;
padding-right: 10px;
}
h2{ clear: both; font-size: 130%; color: black; }
h3{
clear: both;
font-size: 115%;
margin-left: 20px;
margin-top: 30px;
color: brown;
}
h4{
clear: both;
font-size: 90%;
margin-left: 20px;
margin-top: 30px;
}
}
button.accordion {
background-color: #eee;
color: #444;
cursor: pointer;
padding: 18px;
width: 25%;
border: none;
text-align: center;
outline: none;
transition: 0.4s;
}
button.accordion.active, button.accordion:hover {
background-color: #ddd;
}
div.panel {
padding: 0 18px;
display: none;
background-color: white;
}
div.panel.show {
display: block;
}
-->
</style>
</head>
<body>
"@
I d like to pimp my powershell generated html report. I d hope somebody could suggest some changes to my css so it looks more professional (not a designer, more a script er myself).
Thanks!
Below the css
$HTMLHeader += @"
<BODY>
<style type="text/css">
<!--
body {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font: 10pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#report { width: 835px; }
table{
border-collapse: collapse;
border: 1px solid #FFFFFF;
font: 10pt Verdana, Geneva, Arial, Helvetica, sans-serif;
color: black;
margin-bottom: 10px;
}
table td{
border-collapse: collapse;
border: 1px solid #FFFFFF;
font-size: 14px;
padding-left: 10px;
padding-right: 10px;
}
table th {
border-collapse: collapse;
border: 2px solid ##FFFFFF;
font-size: 14px;
font-weight: bold;
padding-left: 10px;
padding-right: 10px;
}
h2{ clear: both; font-size: 130%; color: black; }
h3{
clear: both;
font-size: 115%;
margin-left: 20px;
margin-top: 30px;
color: brown;
}
h4{
clear: both;
font-size: 90%;
margin-left: 20px;
margin-top: 30px;
}
}
button.accordion {
background-color: #eee;
color: #444;
cursor: pointer;
padding: 18px;
width: 25%;
border: none;
text-align: center;
outline: none;
transition: 0.4s;
}
button.accordion.active, button.accordion:hover {
background-color: #ddd;
}
div.panel {
padding: 0 18px;
display: none;
background-color: white;
}
div.panel.show {
display: block;
}
-->
</style>
</head>
<body>
"@
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.