lab.elastik

CSS - Bloc 3

Derniers cours : CSS

Les cours sont classés par ordre où ils ont été donnés, du plus récent au plus ancien.

Afficher une adresse email et éviter les spams

HTML:

<a class="css-email" data-email="info"></a>

CSS:

.css-email {
text-decoration: underline;
cursor: pointer;
}
.css-email::before {
content: attr(data-email);
}
.css-email::after {
content: "@elastik.eu";
}

JS:

<script>
document.addEventListener('DOMContentLoaded', function() {
const emailSpan = document.querySelector('.css-email');
emailSpan.addEventListener('click', function() {
const email = this.dataset.email + '@elastik.eu';
window.location.href = 'mailto:' + email;
// alert("click");
});
});
</script>

How do you add custom color swatches to all WYSIWYG editors?

How do you add custom color swatches to all WYSIWYG editors?

				
					function my_mce4_options($init) {

    $custom_colours = '
        "8D9C35", "vert",
        "812437", "bordeau",
        "EF9CAC", "Rose",
		"E5262A", "rouge",
		"382848", "noir-mauve",
		"FC6050", "orange"
		

    ';

    // build colour grid default+custom colors
    $init['textcolor_map'] = '['.$custom_colours.']';

    // change the number of rows in the grid if the number of colors changes
    // 8 swatches per row
    $init['textcolor_rows'] = 1;

    return $init;
}
add_filter('tiny_mce_before_init', 'my_mce4_options');

CSS3 : guide de référence des propriétés et de leurs valeurs

Cet article de yesyouweb répertorie les propriétés CSS les plus couramment utilisées.

https://yesyouweb.com/css3-guide-reference/