クライアント側の XHTML、CSS、JavaScript に関する概要

著者：Eve Cole 更新時間：2009-06-12 17:47:51

今週は、クライアントの 3 つの部分、xhtml、css、JavaScript の文法基礎を学習します。

まず：xhtml の属性（マーク）について -

1. フォーム属性

2. この 2 つの属性です。固有の識別番号とフォーム名の違い今週の個人的な宿題と使用法によると、主になどのコントロールで使用されます。

3. コントロール属性、</p><P>は type 属性とは別に定義されたコントロールで、テキストボックス、複数選択、ラジオ選択など合計 10 種類あります。、およびパスワードボックスの送信とキャンセルなど。さまざまなニーズに応じてさまざまな制御に使用されます。</p> <P><select> と <option> は、ドロップダウンメニューを制御するために一緒に使用されます。基本形式:</p> <P><select name="" id=""></p> <P><option value="">xx</option></p> <P></select></p> <P><textarea> は、複数行のテキストボックスを作成するために使用されます。</p> <P>4. 一般的に使用される定義属性: font-family: ページ全体のフォントスタイルを定義します。 />空行&nbps ;空スペース</p><P>2</p><P>番目: CSS コントロールページ</p><P>1。スタイルルール: CSS スタイルレイアウトを使用する場合、基本的な形式は次のとおりです。</p> <P>selector</p> <P>{</p><P>属性 1: 値 1;</p><P>属性 2: 値 2;</p> <P>}</p> <P><head > に <style type="text/css"> を </head> に追加すると、CSS 関連関数が呼び出されます。</p> <P>2. セレクター: 要素セレクター、クラスセレクター、ID セレクター、包含セレクター、ワイルドカードセレクター、疑似セレクタークラスと疑似要素セレクター。（各セレクターの機能と使い方については、書籍 54 ～ 56 を参照してください。）</p> <P>3. スタイルルールの位置:</p><P>外部、インライン、埋め込みの合計 3 つの形式があります。</p><P>外部接続とは、生成したページファイルと同階層に.cssファイルを作成し、.css内に有効な属性コードをテキスト形式で記述することです。</p>このメソッドは、<P>ページファイル内の <link rel="stylesheet" type="text/css" ref="stylesheet url"> で</p><P>呼び出されます</p>。このメソッドは、複数のページで同じスタイルを使用する場合に適しています。<P>埋め込みは一般的に使用される CSS 属性です。つまり、<style type="text/css"> を <head></head> に追加し、</p><P>セレクター {</p><P>属性 1: 値属性</p><P>2: 値 2;</p>を使用します<P>。 . .</p> <P>} が</p><P>この形式で使用されます。</p><P>インラインとは、要素の後に style 属性を使用して、表示時にスタイルをマークすることを意味します。基本的にhtmlタグにはstyle属性が付いているものがほとんどです。</p> <P>4.CSSボックステンプレートとオーバーラップ</p><P>(1) margin:マージン border:ボーダーパディング:ボーダー距離 (詳細は書籍53ページを参照)</p> <P>(2) css属性ユニット: (詳細は書籍57〜65ページを参照)</p> <P>(3) div -css ページレイアウト:</p><P>これが重要なポイントです。<table> 属性だけでページ全体をレイアウトできるわけではありませんが、一般的に使用される <div> の方が便利で簡潔です。</p> <P> </P> 3 番目: <P>JavaScript の基本および高度な構文で</p><P>習得する必要があるポイントは 3 つだけです</p>。 <P>1. <script type="text/javascript"> これは、css 属性の呼び出しと同じです。</p> <P>document.write("Hello") は C 言語の printf の意味に相当し、alert に置き換えることもできます。</p> <P>2. イベントハンドラー: このナレッジポイントには 4 つのポイントがあり、ツリー内の 81 ～ 95 ページの詳細な紹介を参照してください。</p> <P>3. 高度な構文: C 言語のデータ型、ループ、シーケンス、選択に似ています。いくつかの違いがあります:</p> <P>(1) データ型を定義する場合、明示的に定義する必要はなく、var を使用するだけです。</p> <P>(2) 異なる型のデータの計算は C 言語ほど明確ではありません。たとえば、文字型とデータ型である var 'a' b も c='a'-b を計算できます。</p> <P>(3) 文字列演算子を追加しました。</p> 4. 関数呼び出し: これは C 言語に似ています。<P><A href="http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">次</a>の</p><P>例を使用して説明します。</p> <P><A href="http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">org /tr/xhtml1/dtd/xhtml1-transitional.dtd</a> "><BR><BR> <html xmlns=" <A href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a> " xml:lang="ja" lang="ja"><BR> <頭><BR> <title>JavaScript の要約</title><BR><BR> <script type="text/javascript"><BR><BR>関数 sum1(m){<BR>変数 i ,n=1;<BR> for(i=1;i<=m;i++){<BR> n=1/i*n;<BR> }<BR> n を返します。<BR> }<BR>関数 sum(n){<BR>変数i,s=0;<BR> for(i=1;i<=n;i++){<BR> s=s+sum1(i);<BR> }<BR>アラート;<BR> }<BR><BR> </script><BR> </head><BR> <本文><BR> <フォームアクション="#" メソッド="get"><BR> 1+1/2!+1/3!+1/4!....1/10!=<BR> <input type="button" value="Sum" onclick="sum(10);" /><BR> </form></p> <P></body><BR> </html></p><P>この問題は関数呼び出しを使用して合計を計算します。誰でも理解できるはずです。私たちの宿題です。</p><P>さて、これが今週の私のまとめです。これは決して包括的なものではなく、単なる参考になれば幸いです。</p></span> </div> </div> </section> <footer class="footer_template"> <div class="w12_box"> <div class="clearfix"> <div class="l_item"> <img src="https://images.downcodes.com/newdown/images/down-logo-foot.png" alt=""> <div class="f_icon"> <a href="https://www.facebook.com/"></a> <a href="https://telegram.org/"></a> <a href="https://www.tiktok.com/"></a> <a href="https://www.youtube.com/"></a> </div> </div> <div class="r_item"> <dl> <dt>Products & Services</dt> <dd><a href="javascript:;">Install APK</a></dd> <dd><a href="javascript:;">APK signature verification</a></dd> <dd><a href="javascript:;">APK Download Service</a></dd> </dl> <dl> <dt>Company</dt> <dd><a href="javascript:;">Developer Console</a></dd> <dd><a href="javascript:;">Submit APK</a></dd> <dd><a href="javascript:;">Monetization of traffic through downcodes</a></dd> </dl> <dl> <dt>Legal</dt> <dd><a href="javascript:;">About us</a></dd> <dd><a href="javascript:;">Contact Us</a></dd> <dd><a href="javascript:;">Cooperation</a></dd> </dl> </div> </div> <p>© 2006-2024Copyright All rights reserves</p> </div> </footer>  <script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="//tongji.zhangwan.net/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '3']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script>   <script async src="https://www.googletagmanager.com/gtag/js?id=G-5D64MDP2H8"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-5D64MDP2H8'); </script> </body> <script src="/newdown/js/jquery.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/lazy.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/index.js" type="text/javascript" charset="utf-8"></script> </html>