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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE settings -->
<link rel="icon" href="https://templates.pingendo.com/assets/Pingendo_favicon.ico">
<title>Styleguide</title>
<meta name="author" content="Pingendo">
<!-- CSS dependencies -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
<link rel="stylesheet" href="wireframe.css" type="text/css"> </head>
<body>
<div class="py-5 text-center" style="background-image: url('../รูป ข้อมูล/120604573.jpg');">
<div class="container">
<div class="row">
<div class="col-12">
<h1 class="text-capitalize text-center display-3"><b>Welcome to communication of
<br>sign language</b></h1>
<p class="lead text-muted">Sirilak Nilduangdee</p>
</div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('../รูป ข้อมูล/pink-2160666_1920.jpg');background-size:cover;background-position:right center;">
<div class="container">
<div class="row" style="background-image: url('../รูป ข้อมูล/120604584.jpg');">
<div class="">
<ul class="nav nav-tabs">
<li class="nav-item text-dark p-4" style="background-image: url('../รูป ข้อมูล/120604584.jpg');">
<a href="Home.html" class="active nav-link"><i class="fa fa-home fa-home w-100"></i><b class="text-center text-capitalize w-100">Home</b></a>
</li>
<li class="nav-item text-dark">
<a class="nav-link" href="sign language.html"><b class="text-center p-5 m-2"><br> <br> Sign Language<br><br></b></a>
</li>
<li class="nav-item text-dark">
<a href="Vedio.html" class="nav-link"><b class="text-center text-dark p-5"><br><br> Vedio</b></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('../รูป ข้อมูล/pattern-1896980_1920.jpg');">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-6">
<img class="d-block w-100 mb-3 rounded p-5" src="../รูป ข้อมูล/SÍMBOLO-INTERNACIONAL-DA-SURDEZ-NO-TRÂNSITO.jpg">
<p class="text-dark lead"><b>ภาษามือ (อังกฤษ: sign language) <br><br>เป็นการ เป็นอวัจนภาษาอย่างหนึ่ง ที่ประกอบด้วย การสื่อสารด้วยมือ, การสื่อสารด้วยร่างกาย และการใช้ริมฝีปากในการสื่อความหมายแทนการใช้เสียงพูด การสื่อสารจะใช้ลักษณะของมือที่ทำเป็นสัญลักษณ์ การเคลื่อนไหวมือ แขนและร่างกาย และการแสดงความรู้สึกทางใบหน้าเพื่อช่วยในการสื่อสารความคิดของผู้สื่อ ภาษาสัญลักษณ์ส่วนใหญ่มักใช้ในกลุ่มผู้พิการทางหู ซึ่งรวมทั้งผู้พิการทางหูเอง ผู้ตีความหมาย (interpreter) ผู้ร่วมงาน เพื่อน และครอบครัวของผู้พิการทางหูซึ่งอาจจะพอได้ยินบ้างหรือไม่ได้ยินเลย</b></p>
</div>
<div class="col-md-6">
<img class="img-fluid d-block w-100 mb-3 rounded p-5" src="../รูป ข้อมูล/interpreter-41437_1280.png">
<p contenteditable="true" class="lead"><b> รูปแบบของการใช้ภาษามือ ภาษามือสากล ที่คนทั่วไปเข้าใจกัน <br>ภาษามือผู้พิการ ที่ใช้กันระหว่างผู้พิการทางการได้ยิน <br>ภาษามือทางทหาร ใช้ในกลุ่มทหารที่ปฏิบัติงานในสถานที่ที่ไม่สามารถสื่อสารด้วยวิธีอื่นได้</b></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('soft-979158_1920.jpg');background-size:auto;background-position:left center;">
<div class="container">
<div class="row">
<div class="col-md-12">
<img class="m-2 p-3 justify-content-center align-items-center align-self-center border img-thumbnail mx-auto" src="../รูป ข้อมูล/ภาษามือเบื้องต้น.jpg" alt="Card image" style="background-image: url("soft-979158_1920.jpg");"> </div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('soft-979158_1920.jpg');">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/MUJFPOa3BBk?autoplay=0" allowfullscreen=" " height="200" width="500"> </iframe>
</div>
</div>
</div>
</div>
</div>
<div class="py-5">
<div class="py-4" style="background-image: url('soft-979158_1920.jpg');">
<div class="container">
<div class="row">
<div class="col-md-6 p-3">
<div class="bg-primary card">
<img class="img-fluid rounded-circle w-75 mx-auto mt-3" src="../รูป ข้อมูล/Screenshot (206).png" alt="Card image">
<div class="card-body">
<h4 class="card-title">deaf person</h4>
<p class="card-text">Sign Language</p>
</div>
</div>
</div>
<div class="col-md-6 p-3">
<div class="card">
<div class="card-img-overlay align-items-center d-flex" style="background-image: url('../รูป ข้อมูล/Screenshot (184).png');background-size:cover;background-position:right top;"></div>
<img class="img-fluid w-100 rounded" src="assets/styleguide/people_6.jpg" alt="Card image"> </div>
</div>
</div>
</div>
</div>
<div class="bg-light py-5" style="background-image: url('soft-979158_1920.jpg');">
<div class="container">
<div class="row">
<div class="col-md-4 p-1">
<div class="เมื่อไหร่">
<img class="card-img-top img-fluid" src="../รูป ข้อมูล/3.png">
<p>
<br>ภาษามือ เป็นการ เป็นอวัจนภาษาอย่างหนึ่ง ที่ประกอบด้วย การสื่อสารด้วยมือ, การสื่อสารด้วยร่างกาย และการใช้ริมฝีปากในการสื่อความหมายแทนการใช้เสียงพูด </p>
</div>
</div>
<div class="col-md-4 p-0">
<div class="card box-shadow">
<img class="card-img-top mx-auto p-1" src="../รูป ข้อมูล/19.png">
<div class="card-body" style="background-image: url('soft-979158_1920.jpg');">
<p class="card-text">การสื่อสารจะใช้ลักษณะของมือที่ทำเป็นสัญลักษณ์ การเคลื่อนไหวมือ แขนและร่างกาย และการแสดงความรู้สึกทางใบหน้าเพื่อช่วยในการสื่อสารความคิดของผู้สื่อ</p>
</div>
</div>
</div>
<div class="col-md-4 p-0">
<div class="card box-shadow">
<img class="card-img-top p-1" src="../รูป ข้อมูล/Screenshot (241).png">
<div class="card-body" style="background-image: url('soft-979158_1920.jpg');">
<p class="card-text">ภาษาสัญลักษณ์ส่วนใหญ่มักใช้ในกลุ่มผู้พิการทางหู ซึ่งรวมทั้งผู้พิการทางหูเอง ผู้ตีความหมาย ผู้ร่วมงาน เพื่อน และครอบครัวของผู้พิการทางหูซึ่งอาจจะพอได้ยินบ้างหรือไม่ได้ยินเลย</p>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<pingendo onclick="window.open('https://pingendo.com/', '_blank')" style="cursor:pointer;position: fixed;bottom: 10px;right:10px;padding:4px;background-color: #00b0eb;border-radius: 8px; width:180px;display:flex;flex-direction:row;align-items:center;justify-content:center;font-size:14px;color:white">Made with Pingendo
<img src="https://pingendo.com/site-assets/Pingendo_logo_big.png" class="d-block" alt="Pingendo logo" height="16">
</pingendo>
</div>
<div class="py-5" style="background-image: url('../รูป ข้อมูล/ring-1902872_1920.jpg');background-size:cover;background-repeat:space;"></div>
<div class="py-5">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2 class="text-center" contenteditable="true" style="background-image: url('../รูป ข้อมูล/120604584.jpg');">ช่องทางการดูข้อมูล ภาษามือ ในเว็บไซต์ต่างๆ</h2>
</div>
</div>
</div>
</div>
<div class="text-center bg-dark" style="background-image: url("none");">
<div class="container-fluid">
<div class="row">
<div class="py-5 col-3" style="background-color:#3b5998">
<a href="https://www.facebook.com/DeafThai/" target="_blank"><i class="fa fa-fw fa-facebook fa-3x text-white"></i></a>
</div>
<div class="py-5 col-3" style="background-color:#00b2ff">
<a href="https://twitter.com/hashtag/%E0%B8%A0%E0%B8%B2%E0%B8%A9%E0%B8%B2%E0%B8%A1%E0%B8%B7%E0%B8%AD" target="_blank"><i class="fa fa-fw fa-twitter fa-3x text-white"></i></a>
</div>
<div class="py-5 col-3" style="background-color: rgb(201, 34, 40);">
<a href="https://www.pinterest.com/explore/%E0%B8%A0%E0%B8%B2%E0%B8%A9%E0%B8%B2%E0%B8%A1%E0%B8%B7%E0%B8%AD/?lp=true" target="_blank"><i class="fa fa-fw fa-3x text-white fa-pinterest"></i></a>
</div>
<div class="py-5 col-3" style="background-color:#4c68d7">
<a href="https://www.instagram.com/learn_a_s_l/" target="_blank"><i class="fa fa-fw fa-instagram fa-3x text-white"></i></a>
</div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('../รูป ข้อมูล/background-2076334_1920.jpg');"></div>
<div class="py-5" style="background-image: url('soft-979158_1920.jpg');">
<div class="container">
<div class="row">
<div class="col-md-5 offset-md-4">
<a href="sign language.html" class="btn btn-outline-primary btn-lg active btn-block border" target="_blank" style="background-image: url("../รูป ข้อมูล/Screenshot (161).png"); background-position: left top;">
<br>
<br>
<br><b class="text-center border m-1 p-1"><b>NEXT</b></b>
<br>
<br>
<br>
<br>
<br> </a>
</div>
</div>
</div>
</div>
<div class="py-5" style="background-image: url('../รูป ข้อมูล/background-2076334_1920.jpg');"></div>
</body>
</html>