• html.cssのオーバーフローを総合的に理解する。

    html.cssのオーバーフローに関する包括的な理解 XML/HTMLコード 内容をクリップボードにコピーする <スパン <!DOCTYPE html > <!DOCTYPE html > <スパン <スパン < html > &lt

    2022-01-13 20:04:56
  • 動画下の自動再生プロパティが無効な場合の解決方法(ミュートプロパティを追加する)。

    背景 videoの下にogg形式の動画を読み込み、autoplay属性を設定したが、Chromeプレビューを使用すると、動画画面は読み込まれるが自動再生できない、F5リフレッシュ後は自動再生できる。F5リフレッシュ後は自動再生できる。初期のコードは以下の通りです。 <video autoplay="autoplay" loop="loop" class="aaa" >

    2022-01-13 19:29:35
  • インライン要素spanの最小高さを定義する

    htmlのページを作るときによく使われるspanタグですが、私の友人の中にはこのタグをうまく使えていない人がいて、うまく使えていると思っているようですが、特に幅と高さを定義しなければならないときには面倒なことになるようです。 以前、友人に聞かれたことがある。 cssでspanのheightとwidthを定義した後、その幅と高さが無効であるかのように変化しないのはなぜでしょうか? 簡

    2022-01-13 19:15:37
  • [css3]Apple携帯電話のロック解除のためのCSS3サンプルフォントシャインエフェクト

    0. 前置き 2016年8月18日 今日、Appleのスマホのスワイプでロック解除すると、プロンプトの単語の上に白い光が点滅してカッコよく感じることに気づいたので、急にテンションが上がって、フォントの上にマウスを置くと(指を模して)、白い光が点滅してフォントを照らすエフェクトを作ってみました。 1. 想い まず、斜めの白い光を作る必要があります。これは、"lightin

    2022-01-13 18:16:51
  • [CSSレイアウト例】CSSで中央揃えを実現する方法N種

    プリアンブル 入社して間もない頃、面接官からセンターリングの質問を連発され、罵倒されたことがあります。"テキストのセンタリングはどうやるんですか?" "複数行のテキストならどうする?" "ブロックレベルの要素を水平にセンタリングするにはどうすればいいのか?" "ブロックレベル要素を垂直方向にセンタリングするには?ブロックレベル要素の垂直方向のセンタリングを実現する方法". 質問は、泥沼の脳の後ろ

    2022-01-13 18:04:06
  • HTMLにおけるdivとspanの違い(共通点と相違点)

    共通すること DIVタグやSPANタグは、あるコンテンツを全体として扱っている、例えば、全体非表示、全体移動など。箱のようなもの。これによって、コードが合理化され、効率が上がります。 相違点 1.divはコンテンツを矩形のブロックに入れており、それを動かすとレイアウトに影響が出る。一方、spanはコンテンツ全体を操作対象として定義しているだけで、レイアウトや表示には影響

    2022-01-13 17:51:02
  • プリタグを自動改行させる サンプルコード

    pre 要素は整形済みテキストを定義します。pre要素で囲まれたテキストは通常、空白と改行が残ります。また、テキストは等幅フォントとして描画されます。 pre>タグの一般的な用途は、コンピュータのソースコードを表現することです。技術ブログの場合、preタグはコードの出力やハイライトによく使われ、デフォルトではpreタグのコンテンツはスコープ外に出ても自動的に折り返されません。 以下は、&

    2022-01-13 17:26:20
  • htmlフォームの送信アクションとurlジャンプアクションの違いについて

    フォームのアクションは、urlジャンプとは異なり、次のようになります。 フォーム形式はバックエンドにデータを渡すことができ、そこでリクエストオブジェクトを使ってフロントエンドに直接データをリクエストすることができます。 フォーム用紙は、2つの方法でデータを渡します。 method="post":これは大量のデータを渡すときに使います。データが渡される前にパッケージ化されるので、この方法でデー

    2022-01-13 17:08:31
  • iframeとwindow.onloadの詳しい使い方

    プリアンブル プロジェクトでは、ページの色を変更するメソッドを実行する前に、ページの読み込みが完了するのを待つ必要があるので、輸出は問題を解決するためにonloadを使用している、しかし、これは私が遭遇した問題を解決していない、私は私のプロジェクトのページがまだロードされていないことがわかったので、知って長い時間を投げた、それは、プロジェクトが操作する非常に古いiframeを使っているので、あな

    2022-01-13 16:54:33
  • [css3] CSS3を使ってヘッダーアニメーション効果を作成する

    NetEaseは、ゲームの公式サイト(http://kanyouxi.163.com/)を見て(取り下げられました)、私が行うために使用するプロジェクトです(2014)、また、私たちの最初の放棄Flashは、アニメーションサイトの生産とHTML5を使用して、ときに業界のいくつかの使用CSS3アクティブ絵画ウェブサイトの実際の生産は、もちろん、現在非常に広く使用されて、特にモバイル側にある、CSS3

    2022-01-13 16:51:53
  • [CSSチュートリアル]CSS動的高さ遷移のアニメーション効果の実装の

    この質問はナゲッツのメッセージから来たもので、友人から以下の私のコードの高さ遷移アニメーションがなぜ機能しないのかと尋ねられたものです。 その 疑似コードは以下のようなものです。 { height: unset; transition: all 0.3s linear; will-change: height; &.up { hei

    2022-01-13 16:44:15
  • DW2021槌目美人ポストカードDreamweaver2021夢見る系

    Adobe Dreamweaver 2021は、DW 2021"と呼ばれ、プロのWebサイト設計ソフトウェアであり、その使用は様々なWebドキュメントを処理するための柔軟な環境を提供し、どのようにDW2021をダウンロードしてインストールするのでしょうか?ここでは、詳細なチュートリアルを見ていきます。 DreamWeaver DW Web Builder 2021 v21.0.

    2022-01-13 16:39:35
  • [CSSチュートリアル】ピュアCSSでDIVホバーを実現するサンプルコード(固定位置編)

    DIVのホバー効果(固定位置)を実現するためのPure CSSです。IE8, 360, FireFox, Chrome, Safari, Opera, Maxthon, Sogou, Windows of the World, etc. 効果は以下の通りです。 実装コードです。 <!DOCTYPE html> <html> <head> <meta c

    2022-01-13 16:30:56
  • 選択/フォーカスされたときにすべてのオプションを表示させる良い方法は、現在

    開発中にこのような要件に出くわしたので、バックアップとして文書化しておきました。 要求事項の背景 ページ上のショートカットキーボードで、支払い方法の選択ボックス(ドロップダウンリスト)を素早く探し出し、選択することができます。 技術的な困難 現在のブラウザは、コードによって位置決めされた場合、ドロップダウンリストのすべてのオプションをリスト表示することをサポートしていません(マウス

    2022-01-13 16:15:43
  • Html5は、コンテナは、画面の高さや残りの高さの適応的なレイアウトの実装を埋めることができます

    フロントエンドのページレイアウトでは、コンテナを画面の高さいっぱい、あるいは画面の残りの高さいっぱいに配置する必要にしばしば遭遇します。通常、この時はheight:100%のCSSで記述することが当然となります。これは、コンテナの内容が書かれている場合は、時間の多くは問題ない、所望の効果を達成することができますが、コンテナの内容が比較的小さい場合は、十分な高さを保持するために、CSSのスタイルは

    2022-01-13 16:03:45
  • html doctypeの役割の紹介

    文書モデルには大きく分けて2つの役割があります。 1. html 文書を解析するために使用する html または xhtml の仕様をブラウザに通知します。 2, ブラウザのレンダリングモードに影響を与える。レンダリングモードが異なると、ブラウザがCSSコードやJavaScriptスクリプトをどのように解析するかに影響するので、特にIEシリーズのブラウザでは、DOCTYPEによって決定され

    2022-01-13 14:52:06
  • htmlのテキストボックス(テキスト)は、様々なメソッドの読み取り専用の実装を使用できません。

    方法1: <input id= "File1" type= "text" 無効/> 使用不可 方法2: <input id= "File1" type= "text" readonly/> read-only 方法3: <input id= "File1" type= "text" style="display:none"/> 非表示(ただし場所を取る)

    2022-01-13 14:38:44
  • IE8、IE9の互換表示モードをHTMLでそれぞれ無効にする裏技

    IE 8から、IEには互換モードが追加され、これをオンにすると、IEの下位バージョンでレンダリングされるようになりました。しかし、これによってページに不具合が生じることもあるので、通常は以下のコードをhtmlに追加して、IEに固定レンダリングモードを使用させるようにしています。 コピーコード コードは以下の通りです。 <meta http-equiv="X-UA-Co

    2022-01-13 14:21:25
  • [CSSチュートリアル】ピュアCSSで作るスクロールシャドウ効果

    さっそくですが、スクロール可能な要素には、非常によくあるケースがあります。通常、要素が現在スクロールされていることを示すために、スクロールに垂直な側面に影を追加して、そのスクロールを可視領域外に与える、このようなものです。 ご覧のように、スクロール中に影が表示されます。 左右の列が静止しており、スクロールするとボーダーに吸着するような場合、CSSでは一般的に pos

    2022-01-13 14:03:12
  • [CSSチュートリアル】カラフルで知的なシャドウ効果を実現するCSS

    背景 前景の要素から特定の色を継承したシャドウ効果を作成する方法をご存知ですか?この記事を読んで、その方法を見つけてください。 先日、ホームセンターの前を通りかかりました( {コード ホームデポ、住宅建築用品の世界的な小売業者)が、販売しているスマートライトを大々的に展示していたんです。 {{コード そのうちのひとつは、テレビの背後に設置された一連の電球で、下の画像に示すように、テレビの前

    2022-01-13 13:19:30