CSS で左上の三角形を作成するいくつかの方法の詳細な説明
|
今日は、CSS を使用して左上の三角形を記述するいくつかの方法を紹介します。 概略図（幅と高さを60pxとした場合の例）:
この種の三角形は、通常、「ダイアログ ボックス」タイプのグラフィックスの左下隅として使用されます。 最初のもの:
#三角形-上左 {
境界線: 30px 実線 #e6686e;
高さ: 0;
幅: 0;
右境界線の色: 透明;
境界線下部の色: 透明;
}
2番目のタイプ:
#三角形-上左 {
幅: 0;
高さ: 0;
上境界線: 60px 実線 #e6686e;
border-right: 60px 透明の実線;
}
3番目のタイプ:
#三角形-上左 {
境界線: 60px 透明の実線;
幅: 0;
高さ: 0;
左境界線の色: #e6686e;
境界線の上部の幅: 0;
}
さまざまな三角形の方法やさまざまな方向の三角形を試すことができます。 よく使用される CSS グラフィックを紹介する、非常におすすめの Web サイトをご紹介します: https://css-tricks.com/the-shapes-of-css/ 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 |
<<: インデックスを使用して数千万のデータを持つ MySQL のクエリ速度を最適化する
>>: WebページのレイアウトではIE6の互換性の問題を考慮する必要があります
推薦する
React+Typescriptはカウントダウンフックメソッドを実装します
まず、setIntervalはフックとしてカプセル化されます👇 'react' から...
DockerでMySQLコンテナを作成する簡単な手順
序文すでに Docker をインストールしており、Docker について簡単に理解しています。ここで...
Dockerに証明書を追加する方法
1. アップグレードプロセス: sudo apt-get updateパッケージが見つからない、パッ...
Ubuntu で G++ を使用して CPP ファイルをコンパイルする
g++ を使用して初めて cpp ファイルをコンパイルしたとき、未定義の参照エラーが報告されました。...
入力[type=file]の起動が遅くて動かなくなる問題を素早く解決します
入力タグタイプがファイルで、タグ内にaccpet="image/*"属性が設定さ...
MySQL の一般的な日付比較および計算関数
MySql での時間比較の実装unix_timestamp() unix_timestamp 関数は...
MySQL 1130例外、リモートログインできない解決策
目次質問： 1. リモートログイン権限を有効にする: 2. MySQLの権限を更新します。 3. テ...
Linux で crontab 出力リダイレクトが有効にならない問題の解決方法
質問LINUX では、定期的なタスクは通常、cron デーモン プロセス [ps -ef | gre...
NFS サーバーの原理と、その構築、構成、展開の手順を簡単に分析します。
目次NFS サービスの概要NFS とは何ですか? NFS マウントの原則NFS サーバーはデータ転送...
Windows Server 2008R2、2012、2016、2019 の違い
目次共通バージョンの紹介共通バージョンのダウンロードアドレスとインストール以下に簡単な違いを示します...
文字列から指定された文字を削除または抽出する JavaScript メソッド (非常によく使用されます)
目次1. 部分文字列() 2. サブストラクチャ() 3.インデックス() 4.最後のインデックス(...
データベースのデフォルトパスを変更した後にmysqlが起動できない問題の解決策
序文mysql がデフォルトのデータベース パスを変更したため、サービスを開始できませんでした。ログ...
Vue の foreach 配列と js の traversal 配列の書き方の説明
Vue foreach配列を記述し、jsで配列をトラバースする方法シナリオVueでAxiosを使用し...
複数のプロジェクトをデプロイする Docker nginx の例
前提条件1. ローカルコンピュータとサーバーにDockerがインストールされています。ダウンロード方...
Linux の RPM パッケージでインストールされた xinetd ベースのサービスの管理
目次序文1. xinetdサービスに基づく起動管理（１）Telnetサービスのインストール（２）Te...