📑 Style Workout 01: html styling by clicks

style_01.html

html styling by clicks

xxxxxxxxxx

 

1

def clickhtml(string,emo='✒️'):

2

    font_color_set=['#E91E63','#FA7A00','#FED85D','#91E351',

3

                    '#00D8A0','#1AADE0','#3355FF','#7855EE']

4

    font_family_set=['times','courier']

5

    font_size_set=[21,22,23,24,25]

6

    font_color=choice(font_color_set)

7

    font_family=choice(font_family_set)

8

    font_size=choice(font_size_set)

9

    html_str="""

10

    <p class='click_header' 

11

    onclick='setStyle(this,

12

        """"+font_color+"""",

13

        """"+font_family+"""",

14

        """"+str(font_size)+"""")'

15

    style='text-shadow:3px 3px 3px #ccc; font-family:courier; 

16

    font-size:20px; color:#ff33ff;'>

17

    """+emo+"""  """+string+"""

18

    </p>

19

    <script>

20

    function setStyle(element,color,family,size) {

21

     var docs=document.getElementsByClassName('click_header');

22

     for (var i=0; i<docs.length; i++) {

23

         docs[i].style='text-shadow:4px 4px 4px slategray; '+

24

                       'font-family:'+family+

25

                       '; font-size:'+size+'px; '; 

26

         docs[i].style.color=color;}; };

27

    </"""+"""script>"""

28

    display(html(html_str))

29

for i in range(4):

30

    print(15*'*=* ')

31

    clickhtml('Header Styling by Clicks #%d'%(i+1))

Language: Sage Gap GP HTML Macaulay2 Maxima Octave Python R Singular

---

Messages