ホームページ  >  記事  >  ウェブフロントエンド  >  HTML と CSS を使用してビジネス サイトを開発する_html/css_WEB-ITnose

HTML と CSS を使用してビジネス サイトを開発する_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:28:421343ブラウズ



第一章HTML 基础
1.html 的基本结构?
解析:
2.HTML 全称
Hyper Text Markup Language(超文本标记语言)
扩展XML:Extendsible Markup Language(可扩展性标记语言)
3.高级记事本
Ue(UltraEdit)
nodepad++
Editplus
快捷键用熟一个即可。
4.编写html 文档的注意点
01.所有标签字母均小写。
02.有开始就要有闭合标签
03.每个层次的标签有一定程度的缩进。
解析:如果发现body 内书写了内容,用浏览器打开后发现没有内容,那么
就需要检查下title 标签有没有闭合。
5.三种文档类型
严格类型,过渡类型,框架类型
6.编码方式
gb2312
Gbk
Gb2312 和gbk 的区别
GB2312 是中国规定的汉字编码,也可以说是简体中文的字符集编码;GBK 是GB2312 的
扩展,除了兼容GB2312 外,它还能显示繁体中文,还有日文的假名
utf-8:全球通用编码
用在网页上可以同一页面显示中文简体繁体及其它语言(如英文,日文,韩文)。
7.W3C:组织
解析:是一个组织,专门用来给各个浏览器厂商等指定规范的。
8.标签
01.h 标签:从h1 到h6 字体逐渐减小。
效果:自身加粗,并且可以控制字号。
02.p 标签:和其他的内容行之间有一个空行。
03.br 换行标签:是自身闭合标签。

04.hr 水平线标签,是自身闭合标签。
05.strong(加粗)、06.em(倾斜)
07.特殊符号:所有的特殊符号都是包括在&;中
空格:
大于号:>
小于号:<
双引号:"
版权符号:©
林徽因:冰心(谢婉莹),小桔灯() 99
你是人间的四月天
9.图像标签
夏洛特的网
html 中两种路径:
第一种:绝对路径,就是挂着盘符的路径形式,例如:c:\\123\\01.jpg
相对路径:相对的对象时当前你访问的html 文档。符号是../(上一级目录)
注意问题:相对路径../:去该html 文件对应的上层文件夹
一般不会使用绝对路径:D:\\1.html
“网络异常的时候,显示的文本”显示的文字”/>
自身闭合标签
10.超链接
分类:页面间链接,锚链接,功能性链接。
页面间链接:
去百度
锚链接:
01.同页面间锚链接
分两步:第一步:在页面目标位置设置一个锚记。/>
第二步:在另一处创建出一个超链接:去看明星的隐私信
息吧

02.跨页面的锚链接
功能性链接:
站长信箱
打开QQ
迅雷
电驴
ek2k://
QQ 旋风
第二章列表、表格与框架
第二章列表、表格与框架
收作业
听写
补充a 标签的一个属性target
1._blank:在新选项卡中打开
2._self:如果没有设置target 属性,默认取值是_self
01.列表
001.无序列表:




002.有序列表



003.定义描述标签:应用场景:在图文混编的情况下使用

放置图片


....

02.表格


表格


















北京上海广州
北京上海广州
北京上海广州



キー ポイント: テーブルの行と列にまたがる
手順: 1. 行と列は何行ありますか?
分析: 3行2列
2. クロス行(rospan)、クロス列(cospan)
3. 基本原則: クロス行とクロス列はtdでのみ表示されます
必ず注意してください。すべての行間および列間操作は td で発生します。
テーブルが行と列を越える手順:
01. テーブルの行と列を決定します
03. 必要に応じて、冗長な td (セル) を削除します
3. しましょうFrameset を再度実行します
機能: 比較的大きなページを複数の小さなページに分割する必要がある場合、通常、バックグラウンド管理者のレイアウトに使用される FrameSet を使用できます。
重要な内容: FrameSet と本体は共存できません。
実装:
最初: 3 つのサブページを作成します:top.html、left.html right.html
次に、メイン ページのindex.html の Frameset タグを介して 3 つのサブページを導入します










注: 01.border は境界線の幅を設定できます。これが 20 に設定されている場合、境界線の幅は 20 ピクセルであることを意味します。
0 にすると、境界線がないことを意味します。
02.noresize=”noresize” では、ユーザーはフレームをドラッグできません。
03.scrolling=”no” では、スクロール バーが表示されません。
Iframe の使用法:
アプリケーション シナリオ: 外部ページをリンクして、スタイルのコードの再利用を実現します。
FrameSet:
01. body
02 と共存できません。インデックス ページを 3 つのページに結合し、大きな
ページ インデックスを 3 つの小さな部分に切り取り、それぞれの小さな部分が 1 つのページ
top.html
right に対応します。 html
04. フレームセットとインラインフレーム iframe
frameset は、Web ページをレイアウトしたり、複数のページを結合したりするために使用されます。これはより複雑で、iframe は通常、オフサイト リンク、天気予報を導入するために使用されます
report
frameset key 属性:
border: set border: 100 の値を取ることができます
frameborder:0 と 1
borderColor: color
frame :noresize srcolling
iframe: noresize srcolling width height
第 3 章 フォーム
第 3 章 フォーム
01. フォームとは? ?
分析: フォームはフォームです
method=”post”>
リセット ボタンを有効にするには、フォームに配置する必要があります

注意点:
02. フォーム要素?
分析: フォーム内のタグはフォーム要素です
03. Lao Shi: get 送信メソッドと post 送信メソッドの違いは何ですか?
分析: get は送信されたデータをアドレスバーに表示します (危険)
2k
1byte=8bit(bit))
(1kb=1024byte(byte)
1mb=1024kb
1Gb=1024mb
1Tb=1024Gb
4M: 4m/ s 512k/s
post フォームでは、開発者ツール (セキュリティ
安全) を通じて、上限がないことがわかります
form 要素の値をサーバーに送信したい場合、
form 要素は次のようにする必要がありますname 属性がありますか?
分析:
フォーム要素:
input: type="text" テキスト ボックス
type="passsword" パスワード ボックス
type="radio" ラジオ ボタン
type="checkbox" チェックボックス
type="submit" 送信ボタン
type="reset" リセットボタン
type="button" 通常ボタン
type="image" 画像ボタン
type="file" ファイルフィールド
type="hidden" 隠しフィールド
ドロップ-ダウン ボックス
選択 -- -オプション ドロップダウン ボックス
複数行のテキスト エリア

属性
: readonly readonly="readonly"
Disabled:disabled="disabled 『
-->
第4回 初めてのCSS入門
1. タスク
1. 3章と4章の語彙
2. 考察
3. 最初の3章のまとめ
4. 4章の内容説明
はじめにDreamweaver ツールの使い方
2. 内容:
1. CSS を使用する意義: コードとスタイルの分離を実現する
01. CSS とは: (Cascading Stylesheet) ページ内での CSS の適用
02. :
分析:

03.CSSの利点
CSSの基本構文CSS
01.CSS の基本構文構造
02.スタイルについて理解する
03.CSS セレクター
タグ セレクター: タグ名を通じて要素のスタイルを設定する
クラス セレクター
分析: 2 つのステップ: ステップ 1: 名前を付けるクラスとしてスタイル設定されるターゲット タグ。属性名
ステップ 2: style タグで、.attribute name{}
を使用して設定します。ID 选择器
解析:
第一步:在要设置样式的标签中起一个名称为id 的属性,
第二步:在style 标签中通过#属性名{}设置
在HTML 中引入CSS 样式
01.行内样式
解析:直接在html 代码的标签中设置style 属性,这种方式缺点做不到代码和样式分离。
02.内部样式表
解析:直接在style 标签中书写样式代码,但是真正在项目发布的时候,还是最好将样式
单独出一个文件,这样会提高网站的性能。
03.外部样式表
解析:通过link 标签引入当前网站css 文件夹中某一个后缀名是.css 的文件,

04.样式优先级
规律:
行内>内部样式表>外部样式表
也就是遵循的是就近原则。
CSS 高级应用
01.CSS 复合选择器
A.后代选择器
B.交集选择器
C.并集选择器
02.CSS 继承特性
A.继承关系
B.继承的应用
注意点:
01.如何调整dreamweaver 中代码视图的字体大小。
.
2.问:
声明:下次课的预习大家一定要好好预习,因为里面的东东很多很杂,所以需要大家多用点
心。
总结:
1.为什么使用CS
2.CSS 语法

3.选择器的优先级
近者优点
4.三种引入样式表方式
第一种:行内样式
第二种:内部样式表
第三种:外部样式表
5. 复合选择器
01.后代选择器空格
02.并集选择器,,,,
03.交集选择器连接写,第一个只能是标签,后续跟的是类样式,ID
6.CSS 当中的继承
作业:
1.预习第五章(难点,希望大家好好预习)
第五章CSS 美化网页元素
内容回顾:
01.CSS:让网页看起来更加美观,可以实现页面样式的复用。层叠样式表
02.CSS 选择器:ID 类选择器标签
03.复合选择器:交集,并集,后代
现阶段,大家所用的选择器,只要能满足题目要求即可,没有必要刻意去使用复合选择器,
等到有一天,你发觉使用常见3 种选择器,定位某一个标签特别麻烦的时候,思路可以往这
个方向偏移。
交集选择器:p.name div#name
并集选择器:p,div
后代选择器: p ul li
04 选择器的.优先级
ID>类选择器>标签选择器
05.CSS 中的继承
子标签可以继承父标签的样式
CSS 美化网页元素
1.span 标签引入
老师说了,通过span 标签,我们学了一个知识点,就是行级标签和块级标签。
行级标签:;所有的行级标签都显示在同一行(span,img)
块级标签:独占一行(p ,div)
2.字体样式
大家教了我一点,就是如果font-family 属性值有多个,用逗号
隔开。如果英文字体和中文字体同时出现,英文位于前面。
02.如果字体属性值有空格,必须有””,
03.如果字体属性是中文,也要有””
分开设置属性:
设置字体类型:font-family:到底是楷体呢还是宋体”楷体_GB2312”
设置字体大小:font-size:设置字体大小
设置字体风格:font-style;倾斜:font-style:italic
设置字体粗细font-weight:bold; 700px
整体设置属性:font:字体风格字体的粗细字体大小字体类型;
----------------------------------------------------

水が油に変わります
3. テキストのスタイル
テキストの色を設定します: color: 前景色
要素の水平方向の配置を設定します: text-align: center left
テキストのインデントを設定します: text-indent:20px;
テキストの行の高さを設定します line- height:20px; line-height と height を同じ高さに設定すると、
ボックス内のコンテンツを垂直方向に中央揃えにすることと同じになります。
テキストの装飾を設定します。 text-decoration: Underground ;
画像とテキストの垂直方向の配置
画像を設定します Vetical-align:middle;
4. ハイパーリンク疑似クラス
a タグ内の img タグの周囲の境界線を削除します。
01.img{border:0px; 02.img{border:none;}
疑似クラス: セレクター (#div .div div): ステータス値 (リンク、訪問済み、ホバー、アクティブ)
a:link: みんなの小さな手がハイパーリンクをクリックしていないときのスタイルの
A:visited: 全員の大きな手のスタイルがハイパーリンクをクリックしました
A:hover: 全員の小さな足がハイパーリンク上にホバリングするスタイル
A:active: 全員の大きな足がハイパーリンクを踏んでいるスタイルですが、スタイルはまだポップアップしていません
マウスの形状を設定します
Cursor:pointer; 小さな手に設定します
Cursor:wait:小さな砂時計のビジーアイコン
5.Div
Div ブロックであることを認識して使用していますレベルラベル、後でレイアウトします
のときによく使います。
6. 背景スタイル: 背景オフセット技術!
div {
background-color: ピンク;//ボックスの背景色を設定します。
background-image: url(image/02.jpg);//特定のラベルを付ける、または単刀直入に言うと
HTML ページ上のボックスの背景画像を設定するものもあります
background-repeat: no-repeat; / /画像がラベルの幅と高さより小さい場合、背景画像は 1 つだけ表示されます
background-repeat:repeat-y: 並べて表示します。垂直方向。
background-position:-104px 0px;
//position は位置を表します。 2 つの値があります。
画像を左に移動する必要がある場合は、負の値を指定します。 2 番目の値は垂直方向のオフセットを表します。画像を移動する必要がある場合は、値を負の値にする必要があります。
width: 300px;
height: 300px;
}
上記の 4 つの属性は記述するコードが多すぎるため、1 つの属性に結合することができ、非常に特殊であり、
共同書き込みを使用することをお勧めします。
背景:ピンク url(image/beauty.jpg) 0px 0px no-repeat;
7. リスト スタイル
List-style-image:url(image/02.jpg)
List-style:none;デフォルトを削除タグ
リストスタイル: 円: 中空円
リストスタイル: 正方形; 正方形
リストスタイル: 10 進数; は、順序なしリストから順序付きリストへの変換を実現します。
第 6 章 ボックス モデル
第 6 章 ボックス モデル
1. ボックス モデル
ボックス モデルには、コンテンツとボックスの属性 (ボーダー、パディング、マージン) が含まれます
ボックス モデルの実際の幅: コンテンツの幅 + 左右のパディング値側面 + 左右の両側の境界線の値
ボックスの実際の高さ: コンテンツの高さ + 上下のパディング値 + 上下の境界線
2. ボックス モデルの共通テスト問題
/*
境界線: 色を設定します。パラメータの数と意味による
1パラメータ: 4つの境界線 色はすべてこの色です
2パラメータ(赤青): 上下の色は赤、左右は青です
3パラメータ(赤青黄) : 上の線の色は赤、
左右の線は青、下の線は黄色です
4つのパラメータ()は上/右/下/左のルールに従って色を設定します
*/
の重要性ボックス モデルを Web ページ レイアウトに変換します:
注: コンテナーにパディングを設定すると、コンテナー自体のサイズが変更されるため、レイアウトするときは十分に注意してください。また、マージンを介して実装できる関数については、パディングを使用しないようにしてください。
Ul の li を ul で囲むことはできません。これは特殊なケースです。 ulにpaddingを設定してもul自体のサイズは変わりません。
2. 標準ドキュメント フロー
ブロック レベルのタグと行レベルのタグ
注: ブロック レベルのタグは、表示属性を通じて行レベルのタグに変換できます
display:block;
display:inline;
3 つの値表示属性の:
01.none: 特定の要素を非表示にします。 display: none; *Hide div*
02.block: 特定の要素を表示します。
03.inline: ブロックレベルのラベルを行レベルのラベルに変換します。
3. img 行をクリックしたときの単一の画像非表示スキーム
Transitional//EN"
"http://www.w3.org/TR/ xhtml1/DTD/ xhtml1-transitional.
dtd">


</title> ;<br />< style type="text/css"><br>a:hover img{<br>display:none;<br>}<br></style><br><body><br><a href= "#"> ;私の上にカーソルを置くと、サプライズがあります。悪い点に対する補償はありません。 <br /><br /><br /><br /><br><img src="image/pig.jpg" /><br></a><br></body><br>< /html><br>第 7 章 フローティング<br> 第 7 章 フローティング<br>1. 一般的な Web ページのレイアウト<br> フローティング: 簡単に理解すると、2 つの div が同じ行に表示されるように Web ページをレイアウトすることになります<br>float のクリアは重要な原則に従う必要があります。つまり、float をクリアする場合は、元のボックス div がフロートする方向によって、float をクリアする方向の値が決まります。 <br>2.overflow: divの高さ崩れの問題を解く<br>高さ崩れはどのようにして起こるのか? <br>分析: この問題は、div 内のすべての子 div が浮動している場合に発生します。解決策は、<br>親 div に overflow:hidden を設定することです。これにより、高さの崩壊の問題が解決されます<br>方法 2: 親 div に、 div 終了タグの前に sub-div を追加し、div に ID を設定してから、スタイルを通じて <br> float をクリアします。コードは次のとおりです: #littlediv{clear:left;}<br>3. ul の最後の li を最初の li の上に配置するにはどうすればよいですか?<br> 分析: ul:position:relative; の相対的な位置を最後に設定することです。 ID を選択して設定します<br>その絶対位置:position:absolute:top:-15px;<br>1. Web ページでのアプリケーションのフローティング<br>フローティングとは、Web ページのレイアウトの一般的なレイアウト方法と一致し、同じ上に 2 つの div を表示します。 line<br> 01. 水平ナビゲーション メニュー<br> 02. グラフィックとテキストの混合<br> 1. 大きな div はコンテナ 360px と呼ばれます<br> 2. 2 つの小さな div で、1 つはタイトルを持ちます。別のホスティングビデオリスト <br> 3. 書き込むリストを定義します。 <br>01. 複数のdlを同じ行に表示できるようにdlを左にフロートします。 <br>02 2つのdlの間に一定の隙間があるようにdl幅を設定します。 <br>03. text-align:center: を使用して、DL のコンテンツを中央に配置します。<br>04. Web ページ内の一部の要素がフローティングになっている場合、解決策 <br> は空の div を追加することです。次に、div のフローティング属性を両方に設定します<br>4. Web ページ要素の 3 つの一般的な配置メカニズム<br>通常のフロー、フローティングおよび絶対配置<br>1) 通常のフロー: 多くの人や記事では、これをドキュメント フローまたは通常のドキュメント フローと呼んでいます。これが実際には標準です そのような言葉はありません。ドキュメント フローの英語への直訳がドキュメント フローである場合、規格には通常のフローまたは通常のフローと呼ばれる別の単語しかありません。しかし、多くの中国語翻訳本がこのようにして出てくるため、誰もがドキュメントフローという名前のほうに慣れているようです。たとえば、「CSS Mastery」では、最初から最後まで通常のフローしかありません。 2) フローティング: フローティング ボックスは、外側の端が接するまで左右に移動できます。収容ボックスまたは別のフローティングボックスの端。 <br>フローティング ボックスはドキュメント内の通常のフローに属しません。要素がフローティングされると、ブロック レベルのボックスのレイアウトには影響しません。ドキュメント内のインライン ボックス (通常はテキスト) の配置にのみ影響します。フローティング ボックスが存在しないかのように動作します。フローティング <br> ボックスの高さが包含ボックスを超える場合、包含ボックスはフローティング要素を閉じるために自動的に伸びません (「高さ崩壊」<br> 現象)。名前が示すように、浮遊雲のように普通の流れに浮かんでいますが、左右にしか浮くことができません。 <br>フローティングの特性上、通常フロー内の要素がフローティングされた後は、収容ボックス内に他の通常フロー要素が存在しないため、高さは 0 (高さ崩壊) になります。実際のレイアウトでは、これは望ましくないことが多いため、フローティング要素を閉じて、その要素を含むボックスが通常の高さを示すようにする必要があります。 <br>フロート、私たちは好きでも嫌いでもある物件です。フローティングを使用すると簡単にレイアウトできるので気に入っていますが、嫌いなのは、フローティング後に解決する必要のある問題が多すぎることです (特に IE6 ~ 7) (以下は特別な指示なしで Windows プラットフォームの IE ブラウザーを指します)。 <br>おそらく多くの人がこの疑問を持っているでしょう、フローティングはどこから来たのですか?なぜフロートをクリアする必要があるのでしょうか?浮きを取り除く原理は何ですか? <br>この記事では、フローティングをより使いやすくするための秘密を段階的に詳しく分析します。 <br>1. フロートを囲むか、フロートをクリアするか? <br>多くの人はこれをフロートのクリアリングと呼ぶことに慣れていますが、私はこれまで常にそう呼んできましたが、それは正確ではありません。 <br>コードを厳格な態度で扱う必要があります。これは、最初の 3 つの質問をよりよく理解するのにも役立ちます。 <br>1) フロートをクリア: クリアに対応する単語はクリアで、CSS の対応する属性はクリアです。 <br>2) フロートを閉じる: より正確な意味は、フローティング要素を閉じることです。フローティングインパクトの衝撃。 <br> 2 つの違いについては、エレガントなデモを参照してください。上記の例を通じて、達成したい効果は単にフロートをクリアするのではなく、実際にフロートを閉じることであることがわかりました。 <br> フッターの両方をクリアに設定します。フロートを除去しても、高い反り崩れの問題は解決されません。 <br>結論: 閉じたフロートの使用はフロートをクリアするよりも厳密であるため、次の記事ではこれを閉じたフロートと呼びます。 <br>2. なぜフロートをクリアする必要があるのですか?この質問に答えるには、まず CSS の位​​置決めメカニズム、つまり通常のフロー、フローティング、絶対位置決めについて説明する必要があります<br> (「position:fixed」は「position:absolute」のサブクラスです)。 <br>1) 通常のフロー: 多くの人や記事では、これをドキュメント フローまたは通常のドキュメント フローと呼んでいます。実際、標準にはそのような言葉はありません。 <br>ドキュメント フローの英語への直訳がドキュメント フローである場合、規格には通常のフローまたは通常のフローと呼ばれる別の単語しかありません。しかし、多くの中国語翻訳本がこのようにして出てくるため、誰もがドキュメントフローという名前のほうに慣れているようです。 <br>例えば『CSS Mastery』、英語の原書では最初から最後まで「normal flow」という言葉しか出てこない、<br>document flow(ドキュメントフロー)は一度も登場していない <br>2) Floating: フローティングボックスはそのままにしておくこともできるまたは右 外側のエッジが、含まれているボックスまたは別のフローティング ボックスのエッジと接触するまで移動します。 <br>フローティングボックスはドキュメント内の通常のフローに属しません。要素がフローティングされると、ブロックレベルのボックスのレイアウトには影響しません。<br>ドキュメント内の通常のフローにのみ影響します。フローティング ボックスの高さが包含ボックスを超えると、包含ボックスが表示され、フローティング要素を閉じるために自動的に伸びません (「高さの崩壊」現象)。名前が示すように、浮遊雲のように普通の流れに浮かんでいますが、左右にしか浮くことができません。 <br>フローティングの特性上、通常のフロー内の要素がフローティングされた後は、収容ボックス内に他の通常のフロー要素が存在しないため、高さは 0 になります (高さ崩壊)。実際のレイアウトでは、これは望ましくないことが多いため、フローティング要素を閉じ、<br>その要素を含むボックスが通常の高さを表示するようにする必要があります。 <br>第 8 章 Web 要素の配置 <br>第 8 章 Web 要素の配置 <br>01. ブロックレベルのタグのみがフローティング可能です <br>02. Web 要素を配置するためのソリューション <br> 静的: デフォルト <br> 絶対的配置 <br> 相対的配置、相対オブジェクト それ自体です<br>固定: スペースのトップ効果に似た固定 <br>注目のキーポイント: <br>絶対位置: <br>01。2 つのタグが含まれており、タグにはネストされた <br> 関係があります。 <br>02. 通常、外側のラベルは相対位置に設定されます。<br>位置: 左、上などを設定する必要はありません。 <br>03. 内部ラベルの絶対位置を設定します。<br>position:absolute;、左と上を設定する必要があります。<br> 経済的な 30 分<br>02. Dangdang ベストセラー ランキング <br>004。淘宝ナビゲーション<br>005 .Xinxin.com<br>006.V+ホームページ<br>007.新着情報ページ<br>008.製品詳細ページ<br>009.ホームテキスタイルページ<br>010.ヘルプセンター<br>011.登録とログインページ<br> <br> <br><br> <br><br> <br><br><br><br><br><br></p> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"></p> <p class="sycode"></p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>声明:</span><div>この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。</div></div></div><div class="nphpSytBox"><span>前の記事:<a class="dBlack" title="擬似オブジェクト セレクター E:after を使用して明確なフローティング効果を実現_html/css_WEB-ITnose" href="http://m.php.cn/ja/faq/270417.html">擬似オブジェクト セレクター E:after を使用して明確なフローティング効果を実現_html/css_WEB-ITnose</a></span><span>次の記事:<a class="dBlack" title="擬似オブジェクト セレクター E:after を使用して明確なフローティング効果を実現_html/css_WEB-ITnose" href="http://m.php.cn/ja/faq/270419.html">擬似オブジェクト セレクター E:after を使用して明確なフローティング効果を実現_html/css_WEB-ITnose</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>関連記事</h2><em><a href="http://m.php.cn/ja/article.html" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/ja/faq/348757.html" title="HTMLの知識のまとめ" class="aBlack">HTMLの知識のまとめ</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348804.html" title="HTMLを早く学ぶ方法" class="aBlack">HTMLを早く学ぶ方法</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348873.html" title="html xhtml xml の違い" class="aBlack">html xhtml xml の違い</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348884.html" title="src 属性と href 属性の違い" class="aBlack">src 属性と href 属性の違い</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ja/faq/348902.html" title="HTML5とCSSの置き換え利用について" class="aBlack">HTML5とCSSの置き換え利用について</a><div class="clear"></div></li></ul></div></div><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/ja/"><b class="icon1"></b><p>ホームページ</p></a></li><li><a href="http://m.php.cn/ja/course.html"><b class="icon2"></b><p>コース</p></a></li><li><a href="http://m.php.cn/ja/wenda.html"><b class="icon4"></b><p>に質問</p></a></li><li><a href="http://m.php.cn/ja/login"><b class="icon5"></b><p>私の</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/ja/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/ja/"><b class="icon1"></b><span>ホームページ</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/course.html"><b class="icon2"></b><span>コース</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/article.html"><b class="icon3"></b><span>記事</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/wenda.html"><b class="icon4"></b><span>に質問</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/dic.html"><b class="icon6"></b><span>辞書</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/course/type/99.html"><b class="icon7"></b><span>マニュアル</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/xiazai/"><b class="icon8"></b><span>ダウンロード</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ja/faq/zt" title="特集"><b class="icon12"></b><span>特集</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/ja/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/ja/" >ホームページ</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/article.html" class="hover">記事</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/wenda.html" >に質問</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/course.html" >コース</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/faq/zt" >特集</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/xiazai" >ダウンロード</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/game" >ゲーム</a></div><div class="swiper-slide"><a href="http://m.php.cn/ja/dic.html" >辞書</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>(ZH-CN)</span></a><a onclick="javascript:setlang('en');" class="language course-right-orders chooselan " href="javascript:;"><span>English</span><span>(EN)</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>(ZH-TW)</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>日本語</span><span>(JA)</span></a><a onclick="javascript:setlang('ko');" class="language course-right-orders chooselan " href="javascript:;"><span>한국어</span><span>(KO)</span></a><a onclick="javascript:setlang('ms');" class="language course-right-orders chooselan " href="javascript:;"><span>Melayu</span><span>(MS)</span></a><a onclick="javascript:setlang('fr');" class="language course-right-orders chooselan " href="javascript:;"><span>Français</span><span>(FR)</span></a><a onclick="javascript:setlang('de');" class="language course-right-orders chooselan " href="javascript:;"><span>Deutsch</span><span>(DE)</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', { slidesPerView : 'auto', observer: true,//修改swiper自己或子元素时,自动初始化swiper observeParents: true,//修改swiper的父元素时,自动初始化swiper }); </script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>