Maison interface Web tutoriel CSS Utilisez du transparent pour faire des triangles

Utilisez du transparent pour faire des triangles

Mar 22, 2018 pm 02:26 PM
triangle

Cette fois, je vais vous montrer comment utiliser du transparent pour créer des triangles et quelles sont les précautions concernant l'utilisation du transparent pour créer des triangles. Vous trouverez ci-dessous un cas pratique, jetons un coup d'œil.

Le rendu est le suivant

Exemple de code

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .box{
            margin: 40px auto;
            width: 60px;
            background-color: #f0ac6b;
        }
        .t1{
            margin: 40px auto;
            width: 0px;
            height: 0px;
            /*background-color: #f0ac6b;*/
            border-bottom: 40px solid red;
            border-right: 20px solid transparent;
            border-left: 20px solid transparent;
        }
        .t2{
            margin: 40px auto;
            width: 0px;
            height: 0px;
            /*background-color: #f0ac6b;*/
            border-bottom: 40px solid transparent;
            border-right: 40px solid red;
            /*border-left: 20px solid transparent;*/
        }
        .t3{
            margin: 40px auto;
            width: 0;
            height: 0;
            border-top: 40px solid red;
            border-right: 20px solid transparent;
            border-left: 20px solid transparent;
        }
        .t4{
            margin: 40px auto;
            width: 0;
            height: 0;
            border-top: 40px solid transparent;
            border-left: 40px solid red;
        }
        .t5{
            margin: 40px auto;
            width: 0;
            height: 0;
            border-top: 40px solid red;
            border-right: 40px solid transparent;
        }
        .t6{
            margin: 40px auto;
            width: 0px;
            height: 0px;
            border-left: 40px solid transparent;
            border-bottom: 40px solid red;
        }
        .t7{
            margin: 40px auto;
            width: 0;
            height: 0;
            border-left: 40px solid red;
            border-bottom: 20px solid transparent;
            border-top: 20px solid transparent;
        }
        .t8{
            margin: 40px auto;
            width: 0;
            height: 0;
            border-right: 40px solid red;
            border-bottom: 20px solid transparent;
            border-top: 20px solid transparent;
        }
    </style>
</head>
<body>
<p class="box">
    <p class="t1"></p>
    <p class="t3"></p>
    <p class="t2"></p>
    <p class="t4"></p>
    <p class="t5"></p>
    <p class="t6"></p>
    <p class="t7"></p>
    <p class="t8"></p>
</p>
</body>
</html>
Copier après la connexion

I je crois que vous l'avez vu Vous maîtrisez la méthode dans le cas de cet article. Pour un contenu plus passionnant, veuillez faire attention aux autres articles liés sur le site Web chinois de php !

Lecture recommandée :

Problèmes de compatibilité du navigateur CSS3

Définition des éléments translucides

Créer interface de connexion rose avec CSS3

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Programme Java pour calculer l'aire d'un triangle à l'aide de déterminants Programme Java pour calculer l'aire d'un triangle à l'aide de déterminants Aug 31, 2023 am 10:17 AM

Introduction Le programme Java pour calculer l'aire d'un triangle à l'aide d'un déterminant est un programme concis et efficace qui peut calculer l'aire d'un triangle à partir des coordonnées de trois sommets. Ce programme est utile à toute personne qui apprend ou travaille avec la géométrie, car il montre comment utiliser les calculs arithmétiques et algébriques de base en Java, ainsi que comment utiliser la classe Scanner pour lire les entrées de l'utilisateur. Le programme demande à l'utilisateur les coordonnées de trois points du triangle, qui sont ensuite lues et utilisées pour calculer le déterminant de la matrice de coordonnées. Utilisez la valeur absolue du déterminant pour vous assurer que l'aire est toujours positive, puis utilisez une formule pour calculer l'aire du triangle et l'afficher à l'utilisateur. Le programme peut être facilement modifié pour accepter des entrées dans différents formats ou pour effectuer des calculs supplémentaires, ce qui en fait un outil polyvalent pour les calculs géométriques. rangs de déterminants

Programme C++ pour imprimer une table de multiplication sous forme de triangle Programme C++ pour imprimer une table de multiplication sous forme de triangle Sep 15, 2023 pm 01:21 PM

Pour mémoriser certains résultats de multiplication de base sous forme tabulaire ou graphique, utilisez la table de multiplication. Cet article explique comment utiliser C++ pour générer une table de multiplication qui ressemble à un triangle rectangle. La notation triangulaire est efficace dans les rares cas où un grand nombre de résultats peuvent être facilement mémorisés. Dans ce format, le tableau est affiché ligne par ligne et colonne par colonne, chaque ligne contenant uniquement les entrées qui remplissent cette colonne. Pour résoudre ce problème, nous avons besoin d’instructions de boucle de base en C++. Pour afficher les nombres de manière triangulaire, nous avons besoin de boucles imbriquées pour imprimer chaque ligne une par une. Nous verrons comment résoudre ce problème. Voyons l'algorithme et la mise en œuvre pour une meilleure compréhension. L'algorithme prend le nombre de lignes de la table de multiplication souhaitée, disons n. Pour i de 1 à n, procédez comme suit. Pour j allant de 1 à i,

Comment trouver la hauteur minimale d'un triangle en fonction de sa base et de son aire en Java ? Comment trouver la hauteur minimale d'un triangle en fonction de sa base et de son aire en Java ? Aug 26, 2023 pm 10:25 PM

Nous avons l'aire 'a' et la base 'b' du triangle. Conformément à l'énoncé du problème, nous devons trouver la hauteur minimale « h » à l'aide du langage de programmation Java. Comme nous le savons, lorsque la base et la hauteur sont données, l'aire d'un triangle est −$$\mathrm{area\:=\:\frac{1}{2}\:*\:base\:*\ : Height}$$ En utilisant la formule ci-dessus, nous pouvons obtenir la hauteur à partir de -height=(2*area)/base puis en utilisant la méthode intégrée ceil(), nous pouvons obtenir la hauteur minimale. Montrez quelques exemples pour vous montrer la traduction chinoise de l'instance-1 : Exemple-1 Supposons que l'aire donnée = 12 et la base = 6, puis utilisez la formule

L'apparence du Huawei P70 est exposée, le module triangulaire ajoute de nouvelles preuves Art Forme irrégulière L'apparence du Huawei P70 est exposée, le module triangulaire ajoute de nouvelles preuves Art Forme irrégulière Mar 05, 2024 pm 08:16 PM

Il a été précédemment rapporté que le produit phare de l'imagerie 5G de la série P70 de Huawei devrait être lancé fin mars et que trois nouveaux modèles, P70, P70Pro et P70Art, devraient être lancés. Désormais, plus d'informations sur la conception de l'apparence de ces nouveaux téléphones ont été exposées. Comme vous pouvez le voir sur l'image ci-dessus, la dernière image divulguée montre que la série Huawei P70 est la même que les rumeurs précédentes. Il est prévu que les modules arrière des P70 et P70Pro adoptent la déco triangulaire (voir le modèle central dans la photo). photo ci-dessus), tandis que le P70Art sera basé sur le Deco triangulaire. Quelques changements, plus audacieux et irréguliers. Ci-dessus, le boîtier de téléphone portable tiers Huawei P70 exposé par @digitalchatstation. Que pensez-vous si la série Huawei P70 finit par ressembler à ceci ? Information historique

Quelle est l'aire du plus grand triangle pouvant être inscrit dans un rectangle ? Quelle est l'aire du plus grand triangle pouvant être inscrit dans un rectangle ? Aug 30, 2023 pm 01:37 PM

Un rectangle est un quadrilatère dont les côtés opposés sont égaux et parallèles. Les côtés adjacents forment 90°. Un triangle est une figure fermée à trois côtés. Le plus grand triangle inscrit dans un rectangle. La base est égale à la longueur du rectangle et la hauteur du triangle est égale à la largeur du rectangle. Aire = (½)*l*b Aire du plus grand triangle inscrit dans un rectangle = (½)*l*b Programme pour calculer l'aire du plus grand triangle dans un rectangle - exemple de code #include<stdio. h>intmain(void){ intl= 10,b=9; zone flottante=(f;

Comment vérifier la validité d'un triangle en Java, lorsque la longueur du côté est donnée ? Comment vérifier la validité d'un triangle en Java, lorsque la longueur du côté est donnée ? Sep 09, 2023 pm 10:53 PM

Comme nous le savons tous, un triangle est un polygone à 3 côtés. Il se compose de trois arêtes et de trois sommets. La somme des trois angles intérieurs est de 180 degrés. Dans un triangle valide, si vous ajoutez deux côtés, il sera plus grand que le troisième côté. Conformément à notre énoncé du problème, nous devons vérifier si le triangle est valide s'il a trois côtés à l'aide du langage de programmation Java. Il faut donc vérifier si les trois conditions suivantes sont remplies. S'il est satisfait, le triangle est valide, sinon le triangle n'est pas valide. Supposons que a, b, c soient les trois côtés d’un triangle. a+b>cb+c>ac+a>b vous montre quelques exemples Exemple 1 Si les côtés sont a=8, b=9, c=5 alors en utilisant la logique ci-dessus, a+b=8+9=17 qui

Si pas plus de deux points du plan sont colinéaires, quel est le nombre de triangles ? Si pas plus de deux points du plan sont colinéaires, quel est le nombre de triangles ? Sep 05, 2023 pm 12:33 PM

Voyons comment compter le nombre de triangles sur un plan étant donné n points et limiter le nombre de points colinéaires à deux maximum. Compter le nombre de triangles dans un plan ne comportant pas plus de deux points colinéaires est un problème typique de la géométrie computationnelle, qui a des applications en infographie, en traitement d'images et dans d'autres domaines de l'informatique. Par exemple, lors de la création d'une image 2D à partir d'une scène 3D dans des graphiques 3D, le problème du calcul de triangles dans un plan ne comportant pas plus de deux points colinéaires peut se poser. Dans ce cas, le processus de comptage de triangles peut être utilisé pour déterminer combien de triangles sont présents dans l’image 2D finale après projection de la scène 3D sur un plan. Cela vous permet de déterminer la complexité de la scène et d'augmenter la vitesse de rendu. En traitement d'image, nous pouvons vouloir compter le nombre d'objets ou de formes uniques dans une image. Ce problème est très complexe.

Programme C++ pour tester l'héritage via la classe triangle Programme C++ pour tester l'héritage via la classe triangle Aug 26, 2023 am 09:57 AM

Supposons que nous souhaitions créer une classe Triangle et une autre sous-classe appelée Isocèle. La classe Triangle a une fonction pour afficher que l'objet est de type triangle, tandis que Isocèle a deux fonctions pour afficher qu'il s'agit d'un triangle isocèle et une description. Nous devons également appeler la fonction de classe parent via l'objet de classe Isocèle. Sans saisie appropriée, nous appelons simplement la fonction de la manière appropriée. Ainsi, si l'entrée doit définir un objet nommé trg puis appeler trg.isosceles(), trg.description(), trg.triangle(), alors la sortie sera Ceci est un triangle isocèle dans un triangle isocèle

See all articles