คำถามติดแท็ก html

HTML (HyperText Markup Language) เป็นภาษามาร์กอัปหลักสำหรับการสร้างเว็บเพจและข้อมูลอื่น ๆ ที่จะแสดงในเว็บเบราว์เซอร์ คำถามเกี่ยวกับ HTML ควรมีตัวอย่างที่ทำซ้ำได้น้อยที่สุดและแนวคิดบางประการเกี่ยวกับสิ่งที่คุณพยายามทำ แท็กนี้ไม่ค่อยได้ใช้คนเดียวและมักจะจับคู่กับ [CSS] และ [javascript]

3
เล่นไฟล์วิดีโอในเครื่อง (ฮาร์ดไดรฟ์) ด้วยแท็กวิดีโอ HTML5 หรือไม่
ฉันต้องการบรรลุสิ่งต่อไปนี้ <video src="file:///Users/username/folder/video.webm"> </video> จุดประสงค์คือผู้ใช้จะสามารถเลือกไฟล์จากฮาร์ดไดรฟ์ของตนได้ และเหตุผลที่ไม่อัปโหลดก็คือค่าใช้จ่ายในการส่งและโควต้าพื้นที่จัดเก็บ จะไม่มีเหตุผลที่จะบันทึกไฟล์ เป็นไปได้ไหม?

2
การเพิ่มองค์ประกอบอินพุตแบบไดนามิกในรูปแบบ
ฉันได้อ่านบล็อกและโพสต์มากมายเกี่ยวกับการเพิ่ม fieldsets แบบไดนามิก แต่ทั้งหมดนี้ให้คำตอบที่ซับซ้อนมาก สิ่งที่ฉันต้องการไม่ซับซ้อนขนาดนั้น รหัส HTML ของฉัน: <input type="text" name="member" value="">Number of members: (max. 10)<br /> <a href="#" id="filldetails">Fill Details</a> ดังนั้นผู้ใช้จะป้อนค่าจำนวนเต็ม (ฉันกำลังตรวจสอบความถูกต้องโดยใช้จาวาสคริปต์) ในinputฟิลด์ และเมื่อคลิกFill Detailsลิงก์จำนวนช่องป้อนข้อมูลที่เกี่ยวข้องจะปรากฏขึ้นเพื่อให้เขาป้อน ฉันต้องการบรรลุสิ่งนี้โดยใช้จาวาสคริปต์ ฉันไม่ใช่มืออาชีพในจาวาสคริปต์ ฉันกำลังคิดว่าฉันจะดึงจำนวนเต็มที่ผู้ใช้กรอกในinputฟิลด์ผ่านลิงค์และแสดงจำนวนช่องป้อนข้อมูลที่สอดคล้องกันได้อย่างไร
91 javascript  html  forms 

7
อนุญาตส่วนหัว Access-Control-Allow-Origin โดยใช้ HTML5 fetch API
ฉันใช้ HTML5 fetch API var request = new Request('https://davidwalsh.name/demo/arsenal.json'); fetch(request).then(function(response) { // Convert to JSON return response.json(); }).then(function(j) { // Yay, `j` is a JavaScript object console.log(JSON.stringify(j)); }).catch(function(error) { console.log('Request failed', error) }); ฉันสามารถใช้ json ปกติ แต่ไม่สามารถดึงข้อมูลของ api url ด้านบนได้ มันแสดงข้อผิดพลาด: ดึงข้อมูล API ไม่สามารถโหลดhttps://davidwalsh.name/demo/arsenal.json ไม่มีส่วนหัว "Access-Control-Allow-Origin" ในทรัพยากรที่ร้องขอ Origin ' http: …
91 html  api  url  fetch-api 

8
การลบสไตล์องค์ประกอบ html ผ่านทางจาวาสคริปต์
ฉันกำลังพยายามแทนที่ค่าแท็กสไตล์อินไลน์ขององค์ประกอบ องค์ประกอบปัจจุบันมีลักษณะดังนี้: `<tr class="row-even" style="background: red none repeat scroll 0% 0%; position: relative; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" id="0000ph2009-06-10s1s02">` และฉันต้องการลบสไตล์ทั้งหมดนั้นออกเพื่อให้มีสไตล์ตามคลาสมากกว่าจะเป็นสไตล์อินไลน์ ฉันได้ลองลบ element.style; และ element.style = null; และ element.style = ""; ไม่มีประโยชน์ รหัสปัจจุบันของฉันแตกที่คำสั่งเหล่านี้ ฟังก์ชันทั้งหมดมีลักษณะดังนี้ function unSetHighlight (index) { if(index < 10) index = "000" + (index); else if (index < …
91 javascript  html  dom  styles 


3
แถว Bootstrap ที่มีคอลัมน์ที่มีความสูงต่างกัน
ขณะนี้ฉันมีสิ่งที่ต้องการ: <div class="row"> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> <div class="col-md-4">Content</div> </div> ตอนนี้สมมติว่าcontentเป็นกล่องที่มีความสูงต่างกันโดยมีความกว้างเท่ากันทั้งหมด - ฉันจะรักษา "เค้าโครงตามตาราง" เดียวกันได้อย่างไรและยังมีกล่องทั้งหมดเรียงกันอยู่ใต้กันและกันแทนที่จะเป็นเส้นที่สมบูรณ์แบบ ปัจจุบัน TWBS จะวางบรรทัดถัดไปของcol-md-4องค์ประกอบที่ยาวที่สุดในแถวที่สามก่อนหน้าดังนั้นแต่ละแถวของรายการจึงถูกจัดวางอย่างสมบูรณ์แบบในขณะที่สิ่งนี้ยอดเยี่ยมฉันต้องการให้แต่ละรายการอยู่ภายใต้องค์ประกอบสุดท้ายโดยตรง (เลย์เอาต์ "ก่ออิฐ" )


11
ปุ่ม Imageless ของ Google
เมื่อเร็ว ๆ นี้มีบทความบางส่วนเกี่ยวกับปุ่มไร้ภาพใหม่ของ Google: http://stopdesign.com/archive/2009/02/04/recreating-the-button.html http://stopdesign.com/eg/buttons/3.0/code.html http://stopdesign.com/eg/buttons/3.1/code.html http://gmailblog.blogspot.com/2009/02/new-ways-to-label-with-move-to-and-auto.html ฉันชอบการทำงานของปุ่มใหม่เหล่านี้ใน Gmail มาก ฉันจะใช้ปุ่มเหล่านี้หรือปุ่มที่คล้ายกันบนไซต์ของฉันได้อย่างไร มีโครงการโอเพ่นซอร์สที่มีรูปลักษณ์และความรู้สึกคล้ายกันหรือไม่? หากฉันต้องการม้วนแพ็กเกจปุ่มของตัวเองแบบนี้โดยใช้ JQuery / XHTML / CSS ฉันจะใช้องค์ประกอบใดได้บ้าง ความคิดเริ่มต้นของฉันคือ: มาตรฐาน<input type="button">กับ css เพื่อปรับปรุงรูปลักษณ์ (บทความการออกแบบส่วนใหญ่พูดถึง css / imges เกี่ยวข้อง) jquery javascript เพื่อเปิดกล่องโต้ตอบแบบกำหนดเองที่รูทไปยังปุ่มบนเหตุการณ์ "onclick" ซึ่งจะมี<a>แท็กอยู่ในนั้นและแถบค้นหาสำหรับการกรอง เค้าโครงตารางสำหรับป๊อปอัปนั้นจะมีเหตุผลหรือไม่? ฉันแย่มากในการทำวิศวกรรมย้อนกลับบนเว็บมีเครื่องมืออะไรบ้างที่ฉันสามารถใช้เพื่อช่วยทำวิศวกรรมย้อนกลับปุ่มเหล่านี้ได้ การใช้แถบเครื่องมือนักพัฒนาเว็บของ Firefox ฉันมองไม่เห็น css หรือ javascript (แม้ว่าจะถูกย่อขนาด) ที่ใช้ในกล่องโต้ตอบป๊อปอัปของปุ่ม ฉันสามารถใช้เครื่องมือเบราว์เซอร์ใดหรือวิธีการอื่นใดเพื่อดูและรับแนวคิดบางอย่าง ฉันไม่ต้องการขโมย IP ใด ๆ …

10
เหตุใด canvas.toDataURL () จึงมีข้อยกเว้นด้านความปลอดภัย
ฉันนอนหลับไม่เพียงพอหรืออะไร? รหัสต่อไปนี้ var frame=document.getElementById("viewer"); frame.width=100; frame.height=100; var ctx=frame.getContext("2d"); var img=new Image(); img.src="http://www.ansearch.com/images/interface/item/small/image.png" img.onload=function() { // draw image ctx.drawImage(img, 0, 0) // Here's where the error happens: window.open(frame.toDataURL("image/png")); } กำลังแสดงข้อผิดพลาดนี้: SECURITY_ERR: DOM Exception 18 ไม่มีทางที่จะไม่ได้ผล! ใครช่วยอธิบายเรื่องนี้หน่อยได้ไหม?


15
HTML5 <video> องค์ประกอบบน Android
ตาม: http://developer.android.com/sdk/android-2.0-highlights.html Android 2.0 ควรรองรับองค์ประกอบวิดีโอ HTML5 ฉันไม่สามารถใช้งานได้โดยใช้ Motorola Droid และไม่สามารถดูวิดีโอบนหน้าตัวอย่างวิดีโอ HTML5 ใด ๆ ได้สำเร็จ เนื่องจากตอนนี้ยังไม่รองรับ QuickTime หรือ Flash นี่เป็นเพียงสิ่งเดียวที่ฉันคิดได้สำหรับการฝังวิดีโอ mp4 ในหน้าเว็บ มีใครโชคดีบ้างคะ?
90 android  video  mobile  html 

2
โพสต์อาร์เรย์จากรูปแบบ HTML โดยไม่ต้องใช้จาวาสคริปต์
ฉันมีแบบฟอร์มที่ซับซ้อนเล็กน้อยและฉันหวังว่าจะลดความซับซ้อนของการประมวลผลฝั่งเซิร์ฟเวอร์ (PHP) โดยการโพสต์อาร์เรย์ของสิ่งทอ ส่วนแรกของแบบฟอร์มแสดงถึงผู้ใช้ : ชื่อจริง นามสกุล อีเมล์ ที่อยู่ ฯลฯ ส่วนที่สองของแบบฟอร์มแสดงถึงต้นไม้ : ผลไม้ ความสูง ฯลฯ ปัญหาคือฉันต้องสามารถโพสต์ต้นไม้หลาย ๆต้นสำหรับผู้ใช้คนเดียวในรูปแบบเดียวกัน ฉันต้องการส่งข้อมูลในฐานะผู้ใช้คนเดียวที่มีต้นไม้มากมายแต่อาจซับซ้อนเกินไปที่จะทำกับแบบฟอร์ม สิ่งเดียวที่อยู่ในใจคือการใช้ javascript เพื่อสร้างข้อความ JSON ด้วยวัตถุผู้ใช้และอาร์เรย์ของวัตถุ Tree แต่จะเป็นการดีหากหลีกเลี่ยงจาวาสคริปต์เพื่อรองรับผู้ใช้จำนวนมากขึ้น (บางคนปิดสคริปต์)
90 php  html  forms  post 

7
เพิ่มช่องว่างระหว่างเซลล์ (td) โดยใช้ css
ฉันกำลังพยายามเพิ่มตารางที่มีช่องว่างระหว่างเซลล์เนื่องจากสีพื้นหลังของเซลล์เป็นสีขาวและสีพื้นหลังของตารางเป็นสีน้ำเงินคุณสามารถเห็นได้อย่างง่ายดายว่าช่องว่างภายในและระยะขอบไม่ทำงาน (ฉันกำลังใช้กับtd) มันจะเพิ่มช่องว่างภายในเซลล์เท่านั้น
90 html  css 

9
จัดแนว div สองตัวในแนวนอนเคียงข้างกันตรงกลางหน้าโดยใช้ bootstrap css
โปรดดูโค้ดด้านล่างสิ่งที่ฉันพยายาม &lt;div class="row"&gt; &lt;div class="center-block"&gt;First Div&lt;/div&gt; &lt;div class="center-block"&gt;Second DIV &lt;/div&gt; &lt;/div&gt; เอาต์พุต: First Div SecondDiv ผลลัพธ์ที่คาดหวัง: First Div Second Div ฉันต้องการจัดแนว div ทั้งสองในแนวนอนให้อยู่กึ่งกลางหน้าโดยใช้ bootstrap css ฉันจะทำอย่างไร ฉันไม่ต้องการใช้ css และแนวคิดแบบลอยตัวเพื่อทำสิ่งนี้ เนื่องจากฉันจำเป็นต้องใช้ bootstrap css เพื่อทำงานในรูปแบบทุกประเภท (เช่นขนาดหน้าต่างและความละเอียดทั้งหมด) แทนที่จะใช้แบบสอบถามสื่อ

8
ปรับขนาดภาพด้วยผ้าใบจาวาสคริปต์ (อย่างราบรื่น)
ฉันกำลังพยายามปรับขนาดภาพด้วยแคนวาส แต่ฉันไม่รู้ว่าจะทำอย่างไรให้เรียบ ใน photoshop เบราว์เซอร์และอื่น ๆ มีอัลกอริทึมบางอย่างที่พวกเขาใช้ (เช่น bicubic, bilinear) แต่ฉันไม่รู้ว่าสิ่งเหล่านี้ถูกสร้างขึ้นในผืนผ้าใบหรือไม่ นี่คือซอของฉัน: http://jsfiddle.net/EWupT/ var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); canvas.width=300 canvas.height=234 ctx.drawImage(img, 0, 0, 300, 234); document.body.appendChild(canvas); อันแรกคือแท็กรูปภาพที่ปรับขนาดตามปกติและอันที่สองคือแคนวาส สังเกตว่าผ้าใบไม่เรียบเท่าไหร่ ฉันจะบรรลุ 'ความราบรื่น' ได้อย่างไร?

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.