検索

CSS3 の新しいプロパティには、1. テキストのシャドウ、2. 背景のグラデーション、4. 要素の回転、6. フォントの変更などがあります。

CSS3 に追加される新しいプロパティ

#この記事の動作環境: Windows 7 システム、Dell G3 コンピューター、css3 バージョン。

今日は、CSS3 の新しいプロパティを紹介します。これは、皆さんの参考になれば幸いです。

CSS3 の最新バージョンの登場により、Web デザインがより簡単になりました。すべてのブラウザがサポートしているわけではありませんが、しかし、テクノロジーの急速な変化により、CSS3 のモジュール標準化により、すべてのブラウザが完全な CSS3 サポートを実装できるようになりました。近い将来、CSS3 と HTML5 がインターネットの未来になると考えています。

ブラウザ互換性の問題の新機能:

Firefox にはプレフィックス -moz- が必要です。

Chrome と Safari にはプレフィックス -webkit- が必要です。

【おすすめコース: CSS3チュートリアル

CSS3テキストシャドウ

<div style="text-shadow: 5px 5px 5px #444;">这是一行文字</div>

Image 23.jpg

CSS3 背景グラデーション効果

CSS3 の線形グラデーション プロパティは、今のところ Safari 4、Chrome でのみ利用可能です。および Firefox 3.6 でサポートされます。


<div background-color: background-repeat: background:></div>

Image 24.jpg

CSS3 カラー効果

不透明度が追加されました

rgb は CSS で使用されます。要素の色ですが、CSS3 には色の不透明度を設定できる新しい操作があり、rgb が rgba に変換され、要素の不透明度を制御する方法が簡素化されています。

<div style="width:50px;height:50px;background-color:rgba(123,123,123,0.4);"></div>

Image 27.jpg

CSS3 変換 (要素の回転)

CSS3 では、要素を回転するための新しい変換属性が導入されています

<div style="width:50px;height:50px;background-color: pink;-webkit-transform:rotate(40deg); ">旋转</div>

Image 25.jpg

CSS3 複数列レイアウト

Web レイアウトでは、各 Web ページを分割する必要がありますCSS3 で使用される複数列レイアウト プロパティは、必要な列数を指定して列数を作成するだけです。分離する必要があります

div.content{
width:210px;
border:1px solid #ccc;
/*将当前内容分成3列*/
-webkit-column-count:3;
-webkit-column-gap:25px;/*列之间的间隔*/
-webkit-column-rule:1px solid #ccc;/*规定列之间的宽度、样式和颜色规则*/
}
</style>
</head>
 <body>
  <div class="content">
	php中文网提供大量免费、原创、高清的php视频教程,并定期举行公益php培训!可边学习边在线修改示例代码,查看执行效果!php从入门到精通,一站式php自学平台!
  </div>

Image 28.jpgCSS3 Web フォント

CSS3 は Web 上に任意のカスタム フォントを埋め込むこともできますページ、元のフォント クライアント システムによっては、Web ページはブラウザーまたはクライアント コンピューターでサポートされているフォントのみを表示できますが、@font-face 属性を使用すると、他の場所にあるフォントを使用できます#

@font-face
{
font-family: myFirstFont;
src: url(Sansation-Italic.ttf)
}
div
{
font-family:myFirstFont;
}
</style>
</head>
<body>
<div>WWWWWW</div>

要約: 上記がこの記事の全内容です。CSS3 の新しいプロパティを理解するのに役立つことを願っています。

以上がCSS3 に追加される新しいプロパティの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
毎週のプラットフォームニュース:Galaxy Store、Tappable Stories、CSS SubgridのWebアプリ毎週のプラットフォームニュース:Galaxy Store、Tappable Stories、CSS SubgridのWebアプリApr 14, 2025 am 11:20 AM

今週のラウンドアップ:Firefoxは錠前屋のような力を獲得し、Samsung&#039; s Galaxy StoreがプログレッシブWebアプリをサポートし始め、CSS SubgridはFirefoxで出荷しています

毎週のプラットフォームニュース:インターネットエクスプローラーモード、検索コンソールの速度レポート、通知プロンプトの制限毎週のプラットフォームニュース:インターネットエクスプローラーモード、検索コンソールの速度レポート、通知プロンプトの制限Apr 14, 2025 am 11:15 AM

今週のラウンドアップ:Internet ExplorerがEdgeに進み、Google Search Consoleが新しい速度レポートを宣伝し、FirefoxがFacebookの通知を提供します

CSSカスタムプロパティを使用したスコープのパワー(および楽しい)CSSカスタムプロパティを使用したスコープのパワー(および楽しい)Apr 14, 2025 am 11:11 AM

おそらく、CSS変数に少なくとも少し精通しているでしょう。そうでない場合は、ここに2秒の概要があります:それらは本当にカスタムプロパティと呼ばれます、あなたは設定します

私たちはプログラマーです私たちはプログラマーですApr 14, 2025 am 11:04 AM

建物のウェブサイトはプログラミングです。 HTMLとCSSの作成はプログラミングです。私はプログラマーです。ここでCSS-Tricksを読んでいる場合、あなたは&#039;

サイトから未使用のCSSをどのように削除しますか?サイトから未使用のCSSをどのように削除しますか?Apr 14, 2025 am 10:59 AM

ここに&#039;私が前もって知るのが好きなこと:これは難しい問題です。あなたがここに上陸した場合、あなたはあなたが伝えることができるツールを指し示すことを望んでいるので、あなたが&#039;

ピクチャーインピクチャーWeb APIの紹介ピクチャーインピクチャーWeb APIの紹介Apr 14, 2025 am 10:57 AM

Picture-in-Pictureは、2016年にMacos SierraをリリースしたSafariブラウザでWebに初めて登場しました。ユーザーがポップできるようになりました。

ギャツビーを使用してぼやけた効果のために画像を整理して準備する方法ギャツビーを使用してぼやけた効果のために画像を整理して準備する方法Apr 14, 2025 am 10:56 AM

Gatsbyは、画像の処理と処理の素晴らしい仕事をしています。たとえば、手動で画像の最適化で時間を節約するのに役立ちます

ああ、パディングの割合は親要素の幅に基づいていますああ、パディングの割合は親要素の幅に基づいていますApr 14, 2025 am 10:55 AM

私は今日、私の頭の中で完全に間違っていたことをパーセンテージベース(%)のパディングについて学びました!パディングの割合はに基づいているといつも思っていました

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

MantisBT

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。