1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
|
---
title: ত্রিমাত্রিক দর্শন
slug: Tools/3D_View
translation_of: Tools/3D_View
original_slug: Tools/ত্রিমাত্রিক_দর্শন
---
<div>{{ToolsSidebar}}</div><p>{{ fx_minversion_header("11") }}</p>
<p><span id="result_box" lang="bn"><span class="hps">যখন আপনি ত্রিমাত্রিক(<span id="result_box" lang="bn"><span class="hps">3D</span></span>) দর্শন</span> বোতাম চাপ দিবেন<span class="hps">,</span><span class="hps"> পাতা</span>টি ত্রিমাত্রিক দর্শন <span class="hps">প্রক্রিয়ায় যাবে</span><span>;</span><span class="hps"> এই</span> <span class="hps">প্রক্রিয়ায় আপনি</span><span id="result_box" lang="bn"><span class="hps"> দেখতে পাবেন</span></span> আপনার পাতা <span id="result_box" lang="bn"><span class="hps">ত্রিমাত্রিক(</span></span><span id="result_box" lang="bn"><span class="hps"><span id="result_box" lang="bn"><span class="hps">3D)</span> <span class="hps">দৃশ্যে<span id="result_box" lang="bn"><span class="hps"><span id="result_box" lang="bn"><span class="hps"> উপস্থাপন</span></span></span></span> করে <span id="result_box" lang="bn"><span class="hps">HTML-এর</span></span></span></span></span></span><span class="hps"> চারকোনা<span id="result_box" lang="bn"><span id="result_box" lang="bn"><span class="hps"> ঘর যা ক্রমবর্ধমান</span> <span class="atn hps">"</span><span>লম্বা</span><span>"</span> <span class="hps">হয়, যেটি </span></span></span></span><span class="hps">আপনার পৃষ্ঠা</span>কে বাইরের দিকে ঠেলে দিচ্ছে<span>।</span><span class="hps"> এই দৃশ্যে দেখা যায় আপনার বিষয়বস্তু</span><span class="hps">গুলো আরও সহজে ঘরের আকৃতিতে প্রকাশ পায়।</span></span></p>
<p><img alt="" class="default internal" src="/files/3625/3dview.png"></p>
<p><span id="result_box" lang="bn"><span class="hps">চেপে রেখে এবং টেনে ধরে</span><span class="hps">, বিভিন্ন কোণ থেকে দেখার জন্য আপনি</span> <span id="result_box" lang="bn"><span class="hps">আপনার</span> <span class="hps">পৃষ্ঠার</span> <span class="hps">DOM(</span></span></span><span id="result_box" lang="bn"><span id="result_box" lang="bn"><span class="hps">Document Object Model)</span> <span class="hps">অনুক্রমের</span> </span>ত্রিমাত্রিক বর্ণনাটি <span class="hps">ঘোরাতে পারেন</span> <span class="hps">এবং</span> <span class="hps">পুনরায়</span> দ্যুতিময় করতে পারেন<span>, </span><span class="hps">এর</span> কাঠামো <span id="result_box" lang="bn"><span class="hps">ভালো</span></span>মতো <span class="hps">পরীক্ষার জন্য</span><span>।</span> <span class="hps">পর্দার আড়ালে থাকা উপাদানসমূহ দৃশ্যমান হবে</span><span class="hps">, যার ফলে আপনি দেখতে পাবেন কোথায় উপাদানগুলোর সম্পর্ক স্থাপিত হয় দৃশ্যমান উপাদান এর সাথে।</span> আপনি উপাদানে চেপে HTML সূচি অথবা Style সূচি থেকে তাদের HTML<span class="hps"> দেখতে পারেন।</span> <span class="hps">বিপরীতভাবে, আপনি breadcrumb bar(এক প্রকার পরিভ্রমণ দণ্ড) এর উপাদানগুলোতে চেপে কোন কোন উপাদান ত্রিমাত্রিক দৃশ্যে থাকবে তা নির্বাচন করতে পারবেন</span><span class="hps">।</span></span></p>
<p>If you do not see the 3D button in the page inspector, it is possible that your graphics driver needs to be updated. See the <a class="link-https" href="https://wiki.mozilla.org/Blocklisting/Blocked_Graphics_Drivers" title="https://wiki.mozilla.org/Blocklisting/Blocked_Graphics_Drivers">blocklisted drivers page</a> for more information.</p>
<h2 id="Controlling_the_3D_view">Controlling the 3D view</h2>
<p>There are keyboard shortcuts and mouse controls available for the 3D view.</p>
<table class="standard-table" style="width: auto;">
<tbody>
<tr>
<td class="header">Function</td>
<td class="header">Keyboard</td>
<td class="header">Mouse</td>
</tr>
<tr>
<td>Zoom in/out</td>
<td>+ / -</td>
<td>Scroll wheel up/down</td>
</tr>
<tr>
<td>Rotate left/right</td>
<td>a / d</td>
<td>Mouse left/right</td>
</tr>
<tr>
<td>Rotate up/down</td>
<td>w / s</td>
<td>Mouse up/down</td>
</tr>
<tr>
<td>Pan left/right</td>
<td>← / →</td>
<td>Mouse left/right</td>
</tr>
<tr>
<td>Pan up/down</td>
<td>↑ / ↓</td>
<td>Mouse up/down</td>
</tr>
<tr>
<td>Reset zoom level</td>
<td>0</td>
<td>Resets the zoom level to the default</td>
</tr>
<tr>
<td>Focus on selected node</td>
<td>f</td>
<td>Makes sure the currently selected node is visible {{ fx_minversion_inline("13.0") }}</td>
</tr>
<tr>
<td>Reset view</td>
<td>r</td>
<td>Resets zoom, rotation, and panning to the default {{ fx_minversion_inline("12.0") }}</td>
</tr>
<tr>
<td>Hide current node</td>
<td>x</td>
<td>Makes the currently selected node invisible; this can be helpful if you need to get at a node that's obscured {{ fx_minversion_inline("12.0") }}</td>
</tr>
</tbody>
</table>
<h2 id="Use_cases_for_the_3D_view">Use cases for the 3D view</h2>
<p>There are a variety of ways the 3D view is useful:</p>
<ul>
<li>If you have broken HTML causing layout problems, looking at the 3D view can help find where you've gone wrong. Often, layout problems are caused by improper nesting of content. This can become much more obvious when looking at the 3D view and seeing where your elements are nested wrong.</li>
<li>If content isn't displaying, you may be able to figure out why; since the 3D view lets you zoom out to see elements that are rendering outside the visible area of the page, you can find stray content this way.</li>
<li>You can get a look at how your page is structured to see if there may be ways to optimize your layout.</li>
<li>And, of course, it looks <strong>awesome</strong>.</li>
</ul>
<h2 id="See_also">See also</h2>
<ul>
<li><a href="/en/Tools/Page_Inspector" title="Page Inspector">Page Inspector</a></li>
<li><a href="/en/Tools/Page_Inspector/HTML_panel" title="HTML panel">HTML panel</a></li>
<li><a href="/en/Tools/Page_Inspector/Style_panel" title="en/Tools/Page_Inspector/Style panel">Style panel</a></li>
<li><a href="/en/Tools" title="Tools">Tools</a></li>
<li><a class="external" href="http://hacks.mozilla.org/2011/12/new-developer-tools-in-firefox-11-aurora/" title="http://hacks.mozilla.org/2011/12/new-developer-tools-in-firefox-11-aurora/">New Developer Tools in Firefox 11 Aurora</a> (blog post)</li>
</ul>
<p>{{ languages( { "ja": "ja/Tools/Page_Inspector/3D_view", "zh-cn": "zh-cn/Tools/Page_Inspector/3D_view"} ) }}</p>
|
