การเขียนโปรแกรม html

13

ฉันมีรายการต่อไปนี้: <ul id="otis"> <li>Benz</li> <li>Other Benz</li> <li>Other Other Benz</li> </ul> ฉันต้องการกำจัดกระสุนดังนั้นฉันพยายาม: ul#otis { list-style-type: none; } ที่ไม่ทำงานแม้ว่า วิธีที่เหมาะสมในการลบหัวข้อย่อยออกจากรายการที่แสดงคืออะไร?

163 html html-lists

6

<img> ระดับบล็อกองค์ประกอบหรือระดับอินไลน์หรือไม่

ฉันได้อ่านบางที่<img>องค์ประกอบนั้นทำงานเหมือนทั้งสอง ถ้าถูกต้องมีใครช่วยอธิบายด้วยตัวอย่างได้ไหม

163 html css image

22

'dragleave' ขององค์ประกอบพาเรนต์ยิงเมื่อลากไปวางองค์ประกอบของเด็ก

ภาพรวม ฉันมีโครงสร้าง HTML ต่อไปนี้และฉันได้แนบdragenterและdragleaveกิจกรรมกับ<div id="dropzone">องค์ประกอบ <div id="dropzone"> <div id="dropzone-content"> <div id="drag-n-drop"> <div class="text">this is some text</div> <div class="text">this is a container with text and images</div> </div> </div> </div> ปัญหา เมื่อฉันลากไฟล์ไป<div id="dropzone">บนdragenterเหตุการณ์จะเริ่มทำงานตามที่คาดไว้ แต่เมื่อฉันเลื่อนเมาส์ของฉันมากกว่าองค์ประกอบลูกเช่น<div id="drag-n-drop">การdragenterจัดกิจกรรมที่เป็นเชื้อเพลิงสำหรับ<div id="drag-n-drop">องค์ประกอบแล้วdragleaveเหตุการณ์ถูกยิงสำหรับ<div id="dropzone">องค์ประกอบ หากฉันเลื่อนเมาส์ไปที่<div id="dropzone">องค์ประกอบอีกครั้งdragenterเหตุการณ์จะถูกยิงอีกครั้งซึ่งเยี่ยมยอด แต่จากนั้นdragleaveเหตุการณ์จะถูกไล่ออกสำหรับองค์ประกอบลูกเพิ่งออกไปดังนั้นremoveClassคำสั่งจะถูกดำเนินการซึ่งไม่เย็น พฤติกรรมนี้เป็นปัญหาด้วยเหตุผล 2 ประการ: ฉันก็แค่ติดdragenterและdragleaveไป<div id="dropzone">ดังนั้นผมจึงไม่เข้าใจว่าทำไมองค์ประกอบเด็กมีเหตุการณ์เหล่านี้ที่แนบมาด้วยเช่นกัน ฉันยังคงลาก<div id="dropzone">องค์ประกอบขณะโฉบเหนือลูกของมันดังนั้นฉันไม่ต้องการdragleaveยิง! jsFiddle นี่คือ jsFiddle เพื่อคนจรจัดด้วย: http://jsfiddle.net/yYF3S/2/ …

163 jquery html file-upload drag-and-drop dom-events

10

“ เต็มหน้าจอ” <iframe>

เมื่อฉันใช้รหัสต่อไปนี้เพื่อสร้าง iframe: <iframe src="mypage.html" style="border: 0; width: 100%; height: 100%">Your browser doesn't support iFrames.</iframe> iframe ไม่ได้ไปตลอดทาง - "ชายแดน" สีขาวขนาด 10 พิกเซลล้อมรอบ iframe ฉันจะแก้ปัญหานี้ได้อย่างไร นี่คือภาพของปัญหา:

163 html iframe

15

กล่องกาเครื่องหมาย Tri-state ในรูปแบบ HTML?

ไม่มีวิธีที่จะมีปุ่มตรวจสอบสามสถานะ (ใช่, ไม่, ไม่มีค่า) ใน HTML ใช่ไหม? มีกลเม็ดหรือวิธีแก้ปัญหาง่ายๆโดยไม่ต้องทำเองทั้งหมดหรือไม่?

163 html forms checkbox

12

ลากไฟล์วางลงในการป้อนไฟล์ html มาตรฐาน

วันนี้เราสามารถลากและวางไฟล์ลงในคอนเทนเนอร์พิเศษแล้วอัปโหลดด้วย XHR 2 หลายครั้ง ด้วยแถบความคืบหน้าสด ฯลฯ สิ่งดีๆมาก ตัวอย่างที่นี่ แต่บางครั้งเราไม่ต้องการความเยือกเย็นขนาดนั้น สิ่งที่ผมต้องการคือการลากและวางไฟล์ - หลายครั้ง - เข้าใส่ไฟล์ HTML มาตรฐาน<input type=file multiple> : เป็นไปได้ไหม มีวิธีการ 'เติม' ไฟล์อินพุตด้วยชื่อไฟล์ที่ถูกต้อง (?) จากไฟล์ดรอปหรือไม่? (เส้นทางไฟล์แบบเต็มไม่พร้อมใช้งานสำหรับเหตุผลด้านความปลอดภัยของระบบไฟล์) ทำไม? เพราะฉันต้องการส่งแบบฟอร์มปกติ สำหรับเบราว์เซอร์และอุปกรณ์ทั้งหมด การลากและวางเป็นเพียงการเพิ่มระดับความก้าวหน้าเพื่อปรับปรุงและลดความซับซ้อนของ UX แบบฟอร์มมาตรฐานพร้อมไฟล์อินพุตมาตรฐาน (+ multipleแอตทริบิวต์) จะอยู่ที่นั่น ฉันต้องการเพิ่มการปรับปรุง HTML5 แก้ไข ฉันรู้ว่าในบางเบราว์เซอร์ที่คุณสามารถบางครั้ง (เกือบตลอดเวลา) วางไฟล์ลงในไฟล์ของตัวเอง ฉันรู้ว่า Chrome ทำเช่นนี้ แต่บางครั้งมันก็ล้มเหลวแล้วโหลดไฟล์ในหน้าปัจจุบัน (ล้มเหลวมากถ้าคุณกรอกแบบฟอร์ม) ฉันต้องการที่จะหลอก & เบราว์เซอร์มัน

163 html file-upload drag-and-drop

6

ไม่ได้ประกาศการเข้ารหัสอักขระของเอกสาร HTML

เมื่อฉันคลิกที่ปุ่มส่งแบบฟอร์มข้อความแสดงข้อผิดพลาดต่อไปนี้จะปรากฏขึ้น: "การเข้ารหัสอักขระของเอกสาร HTML ไม่ถูกประกาศเอกสารจะแสดงผลด้วยข้อความที่อ่านไม่ออกในการกำหนดค่าเบราว์เซอร์บางอย่างหากเอกสารมีอักขระจากนอกช่วง US-ASCII การเข้ารหัสอักขระของหน้าจะต้องถูกประกาศในเอกสารหรือ ในโปรโตคอลการถ่ายโอน " insert.html: <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>insert page</title></head> <body> <h1> Insert Page </h1> <form action="insert.php" method="post" enctype="application/x-www-form-urlencoded" > <p>Title:<input type="text" name="title" size="40"/></p> <p>Price:<input type= "text" name="price" size="40" /></p> <p><input type="submit" value="Insert" /> …

163 php html

12

ปิดการใช้งานองค์ประกอบแบบฟอร์มทั้งหมดภายใน div

มีวิธีการปิดการใช้งานทุกสาขา (textarea / textfield / ตัวเลือก / input / ช่องทำเครื่องหมาย / ส่ง ฯลฯ ) ในรูปแบบโดยบอกชื่อผู้ปกครอง div ใน jquery / javascript เท่านั้น?

162 jquery forms html field

13

เปรียบเทียบ DataFrames สองรายการและส่งออกความแตกต่างแบบเคียงข้างกัน

ฉันพยายามเน้นสิ่งที่เปลี่ยนแปลงระหว่างสอง dataframes สมมติว่าฉันมี Python Pandas สองไฟล์: "StudentRoster Jan-1": id Name score isEnrolled Comment 111 Jack 2.17 True He was late to class 112 Nick 1.11 False Graduated 113 Zoe 4.12 True "StudentRoster Jan-2": id Name score isEnrolled Comment 111 Jack 2.17 True He was late to class 112 Nick 1.21 …

162 python html pandas dataframe panel

7

ทำให้รายการกลางอยู่ตรงกลางเมื่อรายการด้านข้างมีความกว้างต่างกัน

ลองนึกภาพเลย์เอาต์ต่อไปนี้โดยที่จุดแสดงถึงช่องว่างระหว่างกล่อง [Left box]......[Center box]......[Right box] เมื่อฉันลบกล่องขวาฉันชอบกล่องตรงกลางที่จะยังคงอยู่ในศูนย์เช่น: [Left box]......[Center box]................. สิ่งเดียวกันจะเกิดขึ้นหากฉันจะลบกล่องด้านซ้าย ................[Center box]................. ตอนนี้เมื่อเนื้อหาภายในกล่องกลางยาวขึ้นมันจะใช้พื้นที่มากเท่าที่จำเป็นในขณะที่เหลืออยู่กึ่งกลาง กล่องด้านซ้ายและขวาจะไม่ย่อขนาดดังนั้นเมื่อไม่มีที่ว่างเหลืออยู่overflow:hiddenและtext-overflow: ellipsisจะมีผลในการทำลายเนื้อหา [Left box][Center boxxxxxxxxxxxxx][Right box] ทั้งหมดข้างต้นเป็นสถานการณ์ในอุดมคติของฉัน แต่ฉันไม่รู้ว่าจะทำสิ่งนี้ได้อย่างไร เพราะเมื่อฉันสร้างโครงสร้างแบบยืดหยุ่นเช่นนั้น: .parent { display : flex; // flex box justify-content : space-between; // horizontal alignment align-content : center; // vertical alignment } ถ้ากล่องซ้ายและขวามีขนาดเท่ากันฉันจะได้เอฟเฟกต์ที่ต้องการ อย่างไรก็ตามเมื่อหนึ่งในสองนั้นมาจากขนาดที่แตกต่างกันกล่องที่อยู่ตรงกลางไม่ได้อยู่กึ่งกลางอีกต่อไปอย่างแท้จริง มีใครบ้างที่สามารถช่วยฉันได้บ้าง ปรับปรุง A justify-selfจะดีนี่จะเหมาะ: .leftBox …

162 html css flexbox centering

3

Flexbox vs Twitter Bootstrap (หรือเฟรมเวิร์กที่คล้ายกัน) [ปิด]

ปิด คำถามนี้เป็นคำถามความคิดเห็นตาม ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้สามารถตอบข้อเท็จจริงและการอ้างอิงได้โดยแก้ไขโพสต์นี้ ปิดให้บริการใน5 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ฉันได้ค้นพบFlexboxเมื่อเร็ว ๆ นี้เมื่อฉันกำลังมองหาวิธีแก้ปัญหาเพื่อให้ div สูงเหมือนกันขึ้นอยู่กับระดับสูงสุด ฉันได้อ่านหน้าต่อไปนี้บน CSS-tricks.com และเชื่อฉันว่าflexboxเป็นโมดูลที่ทรงพลังมากในการเรียนรู้และใช้งาน อย่างไรก็ตามมันทำให้ฉันคิดถึงความจริงที่ว่า Twitter Bootstrap (และเฟรมเวิร์กที่คล้ายกัน) เสนอฟังก์ชั่นแบบเดียวกัน (+ แน่นอนมากขึ้นเป็นพิเศษ) ด้วยระบบกริด ตอนนี้คำถามคืออะไรข้อดีและข้อเสียของflexboxคืออะไร? มีบางอย่างที่เราไม่สามารถทำได้กับ Flexbox ที่เราสามารถทำกับเฟรมเวิร์กอย่าง Bootstrap (แน่นอนว่าเป็นการพูดถึงระบบกริด) ตัวเลือกใดที่เร็วกว่าเมื่อติดตั้งบนเว็บไซต์ ฉันเดาว่าสำหรับระบบกริดเท่านั้นมันฉลาดกว่าที่จะใช้อย่างหมดจดflexboxแต่ถ้าคุณใช้เฟรมเวิร์กอยู่แล้วจะมีอะไรflexboxเพิ่มบ้างไหม? มีเหตุผลใดบ้างที่จะเลือกflexbox"ระบบกริด" บนกรอบของ?

161 html css twitter-bootstrap flexbox

6

มีลิงค์ที่เกี่ยวข้องกับรูต?

มีวิธีการเชื่อมโยงทั้งหมดในหน้าจะสัมพันธ์กับไดเรกทอรีรากหรือไม่ ตัวอย่างเช่นwww.example.com/fruits/apples/apple.htmlฉันอาจมีลิงค์บอกว่า: <a href="fruits/index.html">Back to Fruits List</a> ลิงค์นี้จะชี้ไปที่www.example.com/fruits/apples/fruits/index.htmlหรือwww.example.com/fruits/index.htmlไม่? ถ้าแรกมีวิธีที่จะให้มันชี้ไปที่ 2 แทนหรือไม่?

161 html location-href

9

การเพิ่มตัวเลือกเพื่อเลือกด้วย javascript

ฉันต้องการจาวาสคริปต์นี้เพื่อสร้างตัวเลือกจาก 12 ถึง 100 ในตัวเลือกที่มี id = "mainSelect" เพราะฉันไม่ต้องการสร้างแท็กตัวเลือกทั้งหมดด้วยตนเอง คุณช่วยชี้ให้ฉันได้ไหม ขอบคุณ function selectOptionCreate() { var age = 88; line = ""; for (var i = 0; i < 90; i++) { line += "<option>"; line += age + i; line += "</option>"; } return line; }

161 javascript html

10

ตัวเลือก CSS เพื่อรับ div ล่าสุดที่มองเห็นได้

คำถามตัวเลือก CSS หากินไม่ทราบว่าเป็นไปได้หรือไม่ ให้บอกว่านี่คือเค้าโครง HTML: <div></div> <div></div> <div></div> <div style="display:none"></div> <div style="display:none"></div> ฉันต้องการเลือกตัวสุดท้ายdivซึ่งแสดง (เช่น. ไม่display:none) ซึ่งจะเป็นตัวที่สามdivในตัวอย่างที่กำหนด ในใจคุณจำนวนของdivในหน้าจริงอาจแตกต่างกัน (แม้แต่display:noneคน)

161 html css css-selectors

6

ที่เก็บข้อมูลในตัวเครื่องปลอดภัยหรือไม่? [ปิด]

ปิด คำถามนี้เป็นคำถามความคิดเห็นตาม ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้สามารถตอบข้อเท็จจริงและการอ้างอิงได้โดยแก้ไขโพสต์นี้ ปิดให้บริการใน2 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ฉันต้องพัฒนาเว็บแอปพลิเคชันที่จะทำงานแบบออฟไลน์เป็นเวลานาน เพื่อให้สิ่งนี้เป็นไปได้ฉันไม่สามารถหลีกเลี่ยงการบันทึกข้อมูลที่ละเอียดอ่อน (ข้อมูลส่วนบุคคล แต่ไม่ใช่ชนิดข้อมูลที่คุณจะเก็บแฮชเท่านั้น) ในที่จัดเก็บในตัวเครื่อง ฉันยอมรับว่านี่ไม่ใช่วิธีปฏิบัติที่แนะนำ แต่มีตัวเลือกเล็กน้อยที่ฉันทำต่อไปนี้เพื่อรักษาความปลอดภัยข้อมูล: การเข้ารหัสทุกอย่างที่อยู่ในที่จัดเก็บในตัวเครื่องโดยใช้ไลบรารี stanford javascript crypto และ AES-256 รหัสผ่านผู้ใช้เป็นรหัสการเข้ารหัสและไม่ได้เก็บไว้ในอุปกรณ์ ให้บริการเนื้อหาทั้งหมด (เมื่อออนไลน์) จากเซิร์ฟเวอร์ที่เชื่อถือได้เดียวผ่าน ssl การตรวจสอบความถูกต้องของข้อมูลทั้งหมดที่ไปและกลับจากที่จัดเก็บในตัวเครื่องบนเซิร์ฟเวอร์โดยใช้โครงการ antaspam ของ owasp ในส่วนเครือข่ายของ appcache ไม่ใช่ใช้ * และแสดงรายการเฉพาะ URIs ที่จำเป็นสำหรับการเชื่อมต่อกับเซิร์ฟเวอร์ที่เชื่อถือได้แทน โดยทั่วไปแล้วพยายามใช้แนวทางที่แนะนำในแผ่นโกง OWASP XSS ฉันขอขอบคุณที่ปีศาจมักจะอยู่ในรายละเอียดและรู้ว่ามีจำนวนมากสงสัยเกี่ยวกับการจัดเก็บในท้องถิ่นและการรักษาความปลอดภัยตามจาวาสคริปต์โดยทั่วไป ทุกคนสามารถแสดงความคิดเห็นว่ามี: ข้อบกพร่องพื้นฐานในแนวทางข้างต้น? วิธีแก้ปัญหาที่เป็นไปได้สำหรับข้อบกพร่องดังกล่าว? มีวิธีใดที่ดีกว่าในการรักษาความปลอดภัยที่จัดเก็บในตัวเครื่องเมื่อแอปพลิเคชัน html 5 ต้องทำงานแบบออฟไลน์เป็นเวลานาน ขอบคุณสำหรับความช่วยเหลือใด ๆ

161 html security local-storage html5-appcache owasp

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