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

ฉันกำลังทำงานบนเว็บไซต์ที่ใช้gulpในการคอมไพล์และเบราว์เซอร์ซิงค์เพื่อให้เบราว์เซอร์ซิงค์กับการเปลี่ยนแปลงของฉัน งานอึกรวบรวมทุกอย่างถูกต้อง แต่บนเว็บไซต์ฉันไม่เห็นสไตล์ใด ๆ และคอนโซลแสดงข้อความแสดงข้อผิดพลาดนี้: ปฏิเสธที่จะใช้สไตล์จาก ' http: // localhost: 3000 / asset / styles / custom-style.css ' เนื่องจากประเภท MIME ('text / html') ไม่ใช่สไตล์ชีท MIME ที่รองรับและเปิดใช้งานการตรวจสอบ MIME อย่างเข้มงวด ตอนนี้ฉันไม่เข้าใจว่าทำไมสิ่งนี้จึงเกิดขึ้น HTML มีไฟล์เช่นนี้ (ซึ่งฉันค่อนข้างแน่ใจว่าถูกต้อง): <link rel="stylesheet" type="text/css" href="assets/styles/custom-style.css"/> และสไตล์ชีทนั้นเป็นการผสานระหว่างรูปแบบการบูตและแบบอักษรที่ยอดเยี่ยมในตอนนี้ (ยังไม่มีการกำหนดเอง) เส้นทางนี้ถูกต้องเช่นกันเนื่องจากเป็นโครงสร้างโฟลเดอร์: index.html assets |-styles |-custom-style.css แต่ฉันได้รับข้อผิดพลาด มันจะเป็นอะไร? นี่เป็นสิ่งที่ (อาจจะเป็นการตั้งค่าหรือไม่) สำหรับ gulp / …

381 html  css  gulp  mime-types  browser-sync 

เป็นไปได้ไหมที่จะตั้งค่า shadow drop สำหรับองค์ประกอบ svg โดยใช้ css3 box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; ฉันเห็นคำพูดบางอย่างเกี่ยวกับการสร้างเงาโดยใช้เอฟเฟกต์ฟิลเตอร์ มีตัวอย่างของการใช้ CSS เพียงอย่างเดียว ด้านล่างเป็นรหัสการทำงานที่มีการใช้สไตล์ cusor อย่างถูกต้อง แต่ไม่มีเอฟเฟกต์เงา โปรดช่วยฉันในการรับเอฟเฟกต์เงาด้วยโค้ดน้อยที่สุด svg .shadow { cursor:crosshair; -moz-box-shadow: -5px -5px 5px #888; -webkit-box-shadow: -5px -5px 5px #888; box-shadow: -5px -5px 5px #888; } <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" …

379 html  css  svg  svg-filters 

ตรรกะในchange()ตัวจัดการเหตุการณ์ไม่ได้ถูกเรียกใช้เมื่อตั้งค่าตามval()แต่มันจะทำงานเมื่อผู้ใช้เลือกค่าด้วยเมาส์ ทำไมนี้ <select id="single"> <option>Single</option> <option>Single2</option> </select> <script> $(function() { $(":input#single").change(function() { /* Logic here does not execute when val() is used */ }); }); $("#single").val("Single2"); </script>

377 jquery  html  select  input 

Apple iPad Mini เป็น iPad 2 ที่มีขนาดเล็กกว่าในแบบที่เราต้องการ ใน JavaScript window.navigatorวัตถุแสดงค่าเดียวกันสำหรับ Mini และ iPad 2 การทดสอบของฉันจนถึงการตรวจสอบความแตกต่างไม่ได้นำไปสู่ความสำเร็จ ทำไมสิ่งนี้จึงสำคัญ เนื่องจากหน้าจอ iPad Mini และ iPad 2 เหมือนกันเป็นพิกเซล แต่แตกต่างกันไปตามขนาดจริง (นิ้ว / เซนติเมตร) ดังนั้นจึงแตกต่างกันไปในPPI (พิกเซลต่อนิ้ว) เพื่อให้เว็บแอปพลิเคชันและเกมมีส่วนต่อประสานกับผู้ใช้ที่เป็นมิตรองค์ประกอบบางอย่างจะถูกปรับขนาดเทียบกับตำแหน่งนิ้วหัวแม่มือหรือนิ้วมือของผู้ใช้ดังนั้นเราอาจต้องการปรับขนาดรูปภาพหรือปุ่มบางอย่างเพื่อให้ประสบการณ์การใช้งานที่ดียิ่งขึ้น สิ่งที่ฉันได้ลองมาแล้ว (รวมถึงวิธีการที่ชัดเจนบางอย่าง): window.devicepixelratio ความกว้างองค์ประกอบ CSS หน่วยเซนติเมตร ข้อความค้นหาสื่อ CSS (เช่นresolutionและ-webkit-device-pixel-ratio) ภาพวาด SVG ในหน่วยที่คล้ายกัน การทำ CSS webkit แปลงทุกประเภทตามเวลาที่กำหนดและนับเฟรมที่แสดงผลด้วยrequestAnimFrame(ฉันหวังว่าจะตรวจสอบความแตกต่างที่วัดได้) ฉันสดจากความคิด แล้วคุณล่ะ? อัปเดต ขอบคุณสำหรับคำตอบ …

376 javascript  html  ipad  svg 

ฉันกำลังทำงานให้กับลูกค้าที่บังคับใช้โหมดความเข้ากันได้กับไซต์อินทราเน็ตทั้งหมด ฉันสงสัยว่ามีแท็กที่ฉันสามารถใส่ลงใน HTML ที่บังคับให้ปิดโหมดความเข้ากันได้หรือไม่

375 html  internet-explorer 

ฉันต้องอัปโหลดเฉพาะไฟล์ภาพผ่าน<input type="file">แท็ก ตอนนี้ยอมรับไฟล์ทุกประเภท แต่ผมต้องการที่จะ จำกัด ไว้เฉพาะนามสกุลไฟล์รูปภาพเท่านั้นที่เฉพาะเจาะจงซึ่งรวมถึง.jpg, .gifฯลฯ ฉันจะใช้ฟังก์ชันนี้ได้อย่างไร

375 html 

ปิด คำถามนี้เป็นคำถามความคิดเห็นตาม ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้สามารถตอบข้อเท็จจริงและการอ้างอิงได้โดยแก้ไขโพสต์นี้ ปิดเมื่อเดือนที่แล้ว ฉันกำลังออกแบบเว็บไซต์ใหม่และฉันต้องการให้มันเข้ากันได้กับเบราว์เซอร์และการตั้งค่าเบราว์เซอร์ให้ได้มากที่สุด ฉันกำลังพยายามตัดสินใจว่าควรใช้หน่วยการวัดแบบใดสำหรับขนาดของแบบอักษรและองค์ประกอบ แต่ไม่สามารถหาคำตอบสรุปได้ คำถามของฉันคือ: ฉันควรใช้pxหรือremใน CSS ของฉัน? จนถึงตอนนี้ฉันรู้ว่าการใช้pxไม่เข้ากันกับผู้ใช้ที่ปรับขนาดแบบอักษรพื้นฐานในเบราว์เซอร์ ฉันไม่สนใจemเพราะพวกเขามีความยุ่งยากในการรักษามากกว่าremพวกเขาเพราะน้ำตก บางคนบอกว่าrems มีความละเอียดอิสระและเป็นที่ต้องการมากกว่า แต่คนอื่นบอกว่าเบราว์เซอร์ที่ทันสมัยส่วนใหญ่ซูมองค์ประกอบทั้งหมดอย่างเท่าเทียมกันอยู่แล้วดังนั้นการใช้pxไม่มีปัญหา ฉันถามสิ่งนี้เพราะมีความคิดเห็นที่แตกต่างกันมากมายเกี่ยวกับระยะทางที่เหมาะสมที่สุดใน CSS และฉันไม่แน่ใจว่าสิ่งใดดีที่สุด

375 html  css  distance  units-of-measurement 

เว็บไซต์ของฉันแสดงผลได้ดีบนเบราว์เซอร์ iPhone / Safari โดยมีข้อยกเว้นข้อเดียว: ช่องป้อนข้อความของฉันมีลักษณะที่โค้งมนแปลก ๆ ซึ่งดูไม่ดีเลยสำหรับส่วนที่เหลือของเว็บไซต์ของฉัน มีวิธีสอน Safari (ผ่าน CSS หรือข้อมูลเมตา) ไม่ให้ปัดเศษฟิลด์อินพุตและแสดงผลเป็นสี่เหลี่ยมตามที่ต้องการหรือไม่?

374 html  css  iphone  mobile-safari  css-reset 

ฉันมีลูกdivกับ: <div class="content"> <h1>heading 1</h1> <h2>heading 2</h2> <p>Some more or less text</p> <a href="/" class="button">Click me</a> </div> และฉันต้องการเค้าโครงต่อไปนี้: ------------------- |heading 1 | |heading 2 | |paragraph text | |can have many | |rows | | | | | | | |link-button | ------------------- ไม่ว่าจะมีข้อความมากแค่ไหนในpฉันต้องการที่จะติด.buttonที่ด้านล่างเสมอโดยไม่ทำให้มันไหลออกมา ฉันได้ยินมาว่าสิ่งนี้สามารถทำได้ด้วย Flexbox แต่ฉันไม่สามารถใช้งานได้

374 html  css  flexbox 

ฉันจะกำหนดเป้าหมายฟิลด์อินพุตของประเภท 'ข้อความ' โดยใช้ตัวเลือก CSS ได้อย่างไร

371 html  css  forms  css-selectors  html-input 

มีวิธีง่ายๆในการลบการจับคู่คลาสทั้งหมดหรือไม่ตัวอย่างเช่น color-* ดังนั้นถ้าฉันมีองค์ประกอบ: <div id="hello" class="color-red color-brown foo bar"></div> หลังจากลบมันจะเป็น <div id="hello" class="foo bar"></div> ขอบคุณ!

370 jquery  html 

พิจารณารหัสต่อไปนี้ : #wrapper { width: 500px; border: 1px solid black; } #first { width: 300px; border: 1px solid red; } #second { border: 1px solid green; } <div id="wrapper"> <div id="first">Stack Overflow is for professional and enthusiast programmers, people who write code because they love it.</div> <div id="second">When you post …

370 css  html 

ฉันมีแบบฟอร์ม นอกฟอร์มนั้นฉันมีปุ่ม ปุ่มง่าย ๆ เช่นนี้: <button>My Button</button> อย่างไรก็ตามเมื่อฉันคลิกมันก็จะส่งแบบฟอร์ม นี่คือรหัส: <form id="myform"> <input /> </form> <button>My Button</button> ปุ่มทั้งหมดนี้ควรทำคือ JavaScript บางอัน แต่ถึงแม้ว่ามันจะดูเหมือนในรหัสข้างต้นก็ส่งแบบฟอร์ม เมื่อฉันเปลี่ยนปุ่มแท็กเพื่อขยายมันทำงานได้อย่างสมบูรณ์ แต่น่าเสียดายที่มันต้องมีปุ่ม มีวิธีใดบ้างที่จะบล็อกปุ่มนั้นไม่ให้ส่งแบบฟอร์ม? ชอบเช่น <button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>

370 javascript  html 

ฉันต้องผ่านและรับพารามิเตอร์สองตัวในสถานะที่ฉันต้องการใช้เพื่อขนส่งui-srefของใช้ui-router สิ่งที่ต้องการใช้ลิงก์ด้านล่างเพื่อเปลี่ยนสถานะเป็นhomeด้วยfooและbarพารามิเตอร์: <a ui-sref="home({foo: 'fooVal', bar: 'barVal'})">Go to home state with foo and bar parameters </a> การรับfooและbarค่าในคอนโทรลเลอร์: app.controller('SomeController', function($scope, $stateParam) { //.. var foo = $stateParam.foo; //getting fooVal var bar = $stateParam.bar; //getting barVal //.. }); ฉันจะได้รับundefinedสำหรับ$stateParamในการควบคุม มีใครช่วยให้ฉันเข้าใจว่าทำอย่างไรให้สำเร็จ แก้ไข: .state('home', { url: '/', views: { '': { templateUrl: 'home.html', controller: …

369 javascript  html  angularjs  angular-ui-router  angular-ui 

ความพยายามในการนำทาง flexbox ที่มีมากถึง 5 รายการและน้อยที่สุดเท่าที่ 3 แต่จะไม่แบ่งความกว้างเท่ากันระหว่างองค์ประกอบทั้งหมด ซอ บทช่วยสอนที่ฉันสร้างแบบจำลองนี้หลังจากนั้นคือhttp://www.sitepoint.com/responsive-fluid-width-variable-item-navigation-css/ SASS * { font-size: 16px; } .tabs { max-width: 1010px; width: 100%; height: 5rem; border-bottom: solid 1px grey; margin: 0 0 0 6.5rem; display: table; table-layout: fixed; } .tabs ul { margin: 0; display: flex; flex-direction: row; } .tabs ul li …

368 html  css  flexbox