Pandas table styling applying formatting to <th> when they are in rows

user_8751567 0
Viewed 59

Given the code below, how can I only apply the blue heading colors to the first row and not the first column (which contains text: First/Second/Third)

enter image description here

df = pd.DataFrame([[1,2,3,4], [5,6,7,8], [3,-5,6,7]], columns=['Foo', 'Bar', 'Buzz', 'Fuzz'], index=['First', 'Second','Third'])
styles = [
    dict(selector="tr:hover",
                props=[("background", "#D6EEEE")]),
    dict(selector="th", props=[("color", "#fff"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("background", "#1D4477"),                             
                               ("font-size", "18px")
                               ]),
    dict(selector="td", props=[("color", "#000000"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("font-size", "15px")
                               ]),
    dict(selector="table", props=[                                   
                                    ("font-family" , 'Helvetica'),
                                    ("margin" , "25px auto"),
                                    ("border-collapse" , "collapse"),
                                    ("border" , "1px solid #eee"),
                                    ("border-bottom" , "2px solid #00cccc"),                                    
                                      ]),
    dict(selector="caption", props=[("caption-side", "bottom")]),
    dict(selector="tr:nth-child(even)", props=[
        ("background-color", "#f2f2f2"),
    ]),
]
df = df.set_table_styles(styles)
pandas html
1 Answers

For me working change th to th.col_heading for select th element with class col_heading only:

styles = [
    dict(selector="tr:hover",
                props=[("background", "#D6EEEE")]),
    dict(selector="th.col_heading", props=[("color", "#fff"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("background", "#1D4477"),
                               ("font-size", "18px")
                               ]),
    dict(selector="td", props=[("color", "#000000"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("font-size", "15px")
                               ]),
    dict(selector="table", props=[                                   
                                    ("font-family" , 'Helvetica'),
                                    ("margin" , "25px auto"),
                                    ("border-collapse" , "collapse"),
                                    ("border" , "1px solid #eee"),
                                    ("border-bottom" , "2px solid #00cccc"),                                    
                                      ]),
    dict(selector="caption", props=[("caption-side", "bottom")]),
    dict(selector="tr:nth-child(even)", props=[
        ("background-color", "#f2f2f2"),
    ]),
]
df.style.set_table_styles(styles)

If need test different styles:

styles = [
    dict(selector="tr:hover",
                props=[("background", "#D6EEEE")]),
    dict(selector="th.col_heading", props=[("color", "#fff"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("background", "#1D4477"),             
                               ("font-size", "18px")
                               ]),
    dict(selector="th.row_heading", props=[("color", "#fff"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("background", "yellow"),
                               ("font-size", "18px")
                               ]),
    dict(selector="td", props=[("color", "#000000"),
                               ("border", "1px solid #eee"),
                               ("padding", "12px 35px"),
                               ("border-collapse", "collapse"),
                               ("font-size", "15px")
                               ]),
    dict(selector="table", props=[                                   
                                    ("font-family" , 'Helvetica'),
                                    ("margin" , "25px auto"),
                                    ("border-collapse" , "collapse"),
                                    ("border" , "1px solid #eee"),
                                    ("border-bottom" , "2px solid #00cccc"),                                    
                                      ]),
    dict(selector="caption", props=[("caption-side", "bottom")]),
    dict(selector="tr:nth-child(even)", props=[
        ("background-color", "#f2f2f2"),
    ]),
]
df.style.set_table_styles(styles)
user_29010020
Related