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

CSS (Cascading Style Sheets) เป็นภาษาสไตล์ชีตที่ใช้สำหรับอธิบายลักษณะและการจัดรูปแบบของ HTML (HyperText Markup Language), XML (Extensible Markup Language) เอกสาร XML และ Extensible Markup Language รวมถึงองค์ประกอบ SVG รวมถึง (แต่ไม่ จำกัด เฉพาะ) สีโครงร่างแบบอักษร และภาพเคลื่อนไหว นอกจากนี้ยังอธิบายถึงวิธีการแสดงองค์ประกอบบนหน้าจอบนกระดาษคำพูดหรือบนสื่ออื่น ๆ

13
การตั้งค่าความกว้างคอลัมน์ตาราง
ฉันมีตารางง่ายๆที่ใช้สำหรับกล่องจดหมายดังนี้: <table border="1"> <tr> <th>From</th> <th>Subject</th> <th>Date</th> </tr> ฉันจะตั้งค่าความกว้างได้อย่างไรจากและวันที่คือ 15% ของความกว้างของหน้าและหัวเรื่องคือ 70% ฉันต้องการให้ตารางใช้ความกว้างของหน้าทั้งหมด
203 html  css  html-table 

9
CSS to line break ก่อน / หลังไอเท็ม `inline-block`
สมมติว่าฉันมี HTML นี้: <h3>Features</h3> <ul> <li><img src="alphaball.png">Smells Good</li> <li><img src="alphaball.png">Tastes Great</li> <li><img src="alphaball.png">Delicious</li> <li><img src="alphaball.png">Wholesome</li> <li><img src="alphaball.png">Eats Children</li> <li><img src="alphaball.png">Yo' Mama</li> </ul> และ CSS นี้: li { text-align:center; display:inline-block; padding:0.1em 1em } img { width:64px; display:block; margin:0 auto } สามารถดูผลลัพธ์ได้ที่นี่: http://jsfiddle.net/YMN7U/1/ ทีนี้ลองนึกดูว่าฉันต้องการแยกสิ่งนี้ออกเป็นสามคอลัมน์ซึ่งเท่ากับการฉีด a <br>หลังจากสาม<li>อัน (จริง ๆ แล้วการทำเช่นนั้นจะไม่ถูกต้องทางความหมายและ syntactically) ฉันรู้วิธีเลือกตัวที่สาม<li>ใน CSS …
202 html  css 

12
CSS / HTML: วิธีที่ถูกต้องในการทำให้ข้อความเป็นตัวเอียงคืออะไร?
เป็นสิ่งที่ถูกต้องวิธีที่จะทำให้ตัวเอียงข้อความ? ฉันได้เห็นสี่แนวทางต่อไปนี้: <i>Italic Text</i> <em>Italic Text</em> <span class="italic">Italic Text</span> <span class="footnote">Italic Text</span> <i> นี่คือ "วิธีเก่า" <i>ไม่มีความหมายเชิงความหมายและบ่งบอกถึงเพียงผลงานนำเสนอของการทำให้ข้อความเป็นตัวเอียง เท่าที่ฉันเห็นนี่เป็นความผิดอย่างชัดเจนเพราะนี่ไม่ใช่ความหมาย <em> สิ่งนี้ใช้เครื่องหมายความหมายเพื่อวัตถุประสงค์ในการนำเสนออย่างหมดจด มันเพิ่งเกิดขึ้น<em>โดยค่าเริ่มต้นทำให้ข้อความเป็นตัวเอียงและดังนั้นจึงมักถูกใช้โดยผู้ที่ทราบว่า<i>ควรหลีกเลี่ยง แต่ผู้ที่ไม่ได้ตระหนักถึงความหมายของความหมาย ข้อความตัวเอียงทั้งหมดไม่ใช่ตัวเอียงเพราะเน้น บางครั้งมันอาจเป็นสิ่งที่ตรงกันข้ามเช่นบันทึกด้านข้างหรือเสียงกระซิบ <span class="italic"> ใช้คลาส CSS เพื่อวางงานนำเสนอ นี่มักจะถูกขนานนามว่าเป็นวิธีที่ถูกต้อง แต่อีกครั้งดูเหมือนว่าฉันผิด สิ่งนี้ไม่ปรากฏว่าสื่อความหมาย<i>ได้อีกต่อไป แต่ผู้เสนอของมันร้องไห้มันง่ายกว่าที่จะเปลี่ยนข้อความตัวเอียงทั้งหมดของคุณในภายหลังถ้าคุณพูดว่าอยากให้มันเป็นตัวหนา แต่นี่ไม่ใช่กรณีเพราะฉันจะถูกทิ้งให้อยู่กับคลาสที่เรียกว่า "ตัวเอียง" ที่แสดงข้อความเป็นตัวหนา นอกจากนี้ยังไม่ชัดเจนว่าทำไมฉันถึงต้องการเปลี่ยนข้อความตัวเอียงทั้งหมดในเว็บไซต์ของฉันหรืออย่างน้อยเราก็สามารถนึกถึงกรณีที่สิ่งนี้จะไม่เป็นที่ต้องการหรือจำเป็น <span class="footnote"> สิ่งนี้ใช้คลาส CSS สำหรับซีแมนทิกส์ จนถึงตอนนี้ดูเหมือนจะเป็นวิธีที่ดีที่สุด แต่จริงๆแล้วมันมีสองปัญหา ข้อความทั้งหมดไม่ได้มีความหมายเพียงพอที่จะรับประกันมาร์กอัปความหมาย ตัวอย่างเช่นข้อความตัวเอียงที่ด้านล่างของหน้าเป็นเชิงอรรถจริง ๆ หรือไม่ หรือมันเป็นกัน? หรืออย่างอื่นอย่างสิ้นเชิง บางทีมันอาจไม่มีความหมายพิเศษและต้องการให้แสดงเป็นตัวเอียงเท่านั้นเพื่อแยกมันออกจากการนำเสนอจากข้อความก่อนหน้า …

10
วิธีปิดการใช้งานการยุบขอบ?
มีวิธีปิดใช้งานการยุบขอบทั้งหมดหรือไม่ วิธีแก้ปัญหาเดียวที่ฉันพบ (โดยใช้ชื่อ "uncollapsing") เกี่ยวข้องกับการใช้ 1px border หรือ 1px padding ฉันพบสิ่งที่ยอมรับไม่ได้: พิกเซลที่ไม่เกี่ยวข้องนั้นทำให้การคำนวณซับซ้อนขึ้นโดยไม่มีเหตุผลที่ดี มีวิธีที่เหมาะสมกว่าในการปิดใช้งานการยุบขอบนี้หรือไม่
202 css  margin  collapse 

5
โทรกลับเมื่อการเปลี่ยนแปลง CSS3 เสร็จสิ้น
ฉันต้องการลบองค์ประกอบ (เปลี่ยนความทึบของมันเป็น 0) จากนั้นเมื่อลบองค์ประกอบออกจาก DOM ใน jQuery สิ่งนี้จะตรงไปตรงมาเนื่องจากคุณสามารถระบุ "ลบ" ที่จะเกิดขึ้นหลังจากที่ภาพเคลื่อนไหวเสร็จสมบูรณ์ แต่ถ้าฉันต้องการเคลื่อนไหวโดยใช้การเปลี่ยน CSS3 จะต้องรู้อีกต่อไปเมื่อการเปลี่ยนแปลง / ภาพเคลื่อนไหวเสร็จสิ้นหรือไม่
202 javascript  jquery  css 

7
ซ่อน Spinner ใน Input Number - Firefox 29
ใน Firefox 28 ฉันใช้<input type="number">งานได้ดีเพราะมันแสดงแป้นพิมพ์ตัวเลขในฟิลด์อินพุตซึ่งควรมีตัวเลขเท่านั้น ใน Firefox 29 การใช้ตัวเลขอินพุตจะแสดงปุ่มหมุนที่ด้านขวาของฟิลด์ซึ่งดูเหมือนว่าไร้สาระในการออกแบบของฉัน ฉันไม่ต้องการปุ่มเพราะมันไร้ประโยชน์เมื่อคุณต้องการเขียนบางอย่างเช่นหมายเลข 6 ~ 10 หลัก เป็นไปได้หรือไม่ที่จะปิดการใช้งานด้วย CSS หรือ jQuery
202 jquery  css  firefox  input  spinner 

17
วิธีการจัดรูปแบบตัวเลือกขององค์ประกอบ "เลือก" html
นี่คือ HTML ของฉัน: <select id="ddlProducts" name="ddProducts"> <option>Product1 : Electronics </option> <option>Product2 : Sports </option> </select> ฉันต้องการสร้างชื่อของผลิตภัณฑ์ (เช่น 'Product1', 'Product2' ฯลฯ ) เป็นตัวหนาและหมวดหมู่ (ได้แก่ อิเล็กทรอนิกส์, กีฬา, ฯลฯ ) เป็นตัวเอียงโดยใช้ CSS เท่านั้น ฉันพบคำถามเก่าที่กล่าวถึงมันเป็นไปไม่ได้โดยใช้ HTML และ CSS แต่หวังว่าจะมีวิธีแก้ปัญหา
202 html  css  drop-down-menu 

29
ฉันจะเพิ่มระยะห่างระหว่างคอลัมน์ใน Bootstrap ได้อย่างไร
ฉันแน่ใจว่ามีวิธีแก้ไขปัญหานี้อย่างง่าย โดยทั่วไปถ้าฉันมีสองคอลัมน์ฉันจะเพิ่มช่องว่างระหว่างพวกเขาได้อย่างไร เช่นถ้า html คือ: <div class="col-md-6"></div> <div class="col-md-6"></div> เอาต์พุตจะเป็นสองคอลัมน์ถัดจากกันโดยใช้ความกว้างทั้งหมดของหน้า บอกว่าตั้งไวด์ ธ1000pxแล้วแต่ละ div จะเป็น500pxไวด์ ถ้าฉันต้องการที่100pxว่างระหว่างสองสิ่งฉันจะทำสิ่งนี้ได้อย่างไร เห็นได้ชัดโดยอัตโนมัติผ่าน bootstrap ขนาด div จะกลายเป็นขนาด450pxเพื่อชดเชยพื้นที่

8
ฉันสามารถเปลี่ยนสีเติมของเส้นทาง svg ด้วย CSS ได้หรือไม่
ฉันมีรหัสต่อไปนี้: <span> <svg height="32" version="1.1" width="32" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.0166626px; top: -0.983337px;"> <desc></desc> <defs/> <path style="" fill="#333333" stroke="none" d="M15.985,5.972C8.422,5.972,2.289999999999999,10.049,2.289999999999999,15.078C2.289999999999999,17.955,4.302999999999999...............1,27.68,22.274Z"/> </svg>  </span> เป็นไปได้หรือไม่ที่จะเปลี่ยนสีเติมของเส้นทาง SVG ด้วย CSS หรือวิธีการอื่นโดยไม่เปลี่ยนแปลงในแท็กพา ธ
202 css  svg 

11
เปลี่ยนเคอร์เซอร์เป็นมือเมื่อวางเมาส์เหนือแถวในตาราง
ฉันจะเปลี่ยนชี้เคอร์เซอร์ไปที่มือวิธีเมื่อเมาส์ของฉันไปมากกว่า<tr>ใน<table> <table class="sortable" border-style:> <tr> <th class="tname">Name</th><th class="tage">Age</th> </tr> <tr><td class="tname">Jennifer</td><td class="tage">24</td></tr> <tr><td class="tname">Kate</td><td class="tage">36</td></tr> <tr><td class="tname">David</td><td class="tage">25</td></tr> <tr><td class="tname">Mark</td><td class="tage">40</td></tr> </table>
201 html  css  cursor 

11
รายการที่เรียงลำดับสามารถสร้างผลลัพธ์ที่ดูเหมือน 1.1, 1.2, 1.3 (แทนที่จะเป็นเพียง 1, 2, 3, …) ด้วย css หรือไม่
รายการที่เรียงลำดับสามารถสร้างผลลัพธ์ที่มีลักษณะเช่น 1.1, 1.2, 1.3 (แทนที่จะเป็นเพียง 1, 2, 3, ... ) ด้วย CSS หรือไม่? จนถึงตอนนี้การใช้list-style-type:decimalมีการผลิตเพียง 1, 2, 3, ไม่ใช่ 1.1, 1.2., 1.3
201 html  css 

9
รับค่า CSS ด้วย JavaScript
ฉันรู้ว่าฉันสามารถตั้งค่า CSS ผ่าน JavaScript เช่น: document.getElementById('image_1').style.top = '100px'; แต่ฉันสามารถรับค่าสไตล์เฉพาะปัจจุบันได้หรือไม่ ฉันอ่านที่ฉันสามารถใช้สไตล์ทั้งหมดให้องค์ประกอบได้ แต่ฉันไม่ต้องการแยกสตริงทั้งหมดถ้าไม่จำเป็น
201 javascript  css 

10
การพิมพ์ CSS: หลีกเลี่ยง DIV แบบครึ่งหน้าระหว่างหน้าหรือไม่
ฉันกำลังเขียนปลั๊กอินสำหรับชิ้นส่วนของซอฟต์แวร์ที่นำชุดใหญ่ของรายการและปรากฏใน HTML ใน WebView ใน Cocoa (ซึ่งใช้ WebKit เป็น renderer ดังนั้นโดยทั่วไปคุณสามารถสมมติว่าไฟล์ HTML นี้เปิดอยู่ Safari) DIV นั้นสร้างมาจากความสูงแบบไดนามิก แต่ก็ไม่ได้แปรเปลี่ยนไปมากนัก พวกเขามักจะประมาณ 200px อย่างไรก็ตามมีรายการเหล่านี้ประมาณหกแสนรายการต่อเอกสารฉันมีเวลาที่ยากลำบากในการพิมพ์ นอกจากว่าฉันจะโชคดีมีรายการที่ตัดครึ่งที่ด้านล่างและด้านบนของทุกหน้าและนั่นทำให้การใช้งานพิมพ์จริงยากมาก ฉันได้ลองใช้ตัวแบ่งหน้าก่อนหน้าตัวแบ่งหน้าแบ่งหน้าและชุดค่าผสมสามแบบที่ไม่มีประโยชน์ ฉันคิดว่าอาจเป็นเพราะ WebKit แสดงคำแนะนำไม่ถูกต้องหรืออาจเป็นเพราะฉันไม่เข้าใจวิธีใช้งาน ฉันต้องการความช่วยเหลือ ฉันจะป้องกันไม่ให้ครึ่งหนึ่งของ DIV ของฉันถูกพิมพ์ได้อย่างไรเมื่อพิมพ์?

4
จัด DIV แบบอินไลน์บล็อกให้อยู่ด้านบนขององค์ประกอบคอนเทนเนอร์
เมื่อทั้งสองinline-block divมีความสูงต่างกันทำไมช่วงที่สั้นของทั้งสองนั้นไม่ตรงกับด้านบนของภาชนะ ( DEMO ): .container { border: 1px black solid; width: 320px; height: 120px; } .small { display: inline-block; width: 40%; height: 30%; border: 1px black solid; background: aliceblue; } .big { display: inline-block; border: 1px black solid; width: 40%; height: 50%; background: beige; } <div class="container"> <div class="small"></div> …
201 css 

10
องค์ประกอบ CSS div - วิธีการแสดงแถบเลื่อนแนวนอนเท่านั้น?
ฉันมีคอนเทนเนอร์ div และได้กำหนดสไตล์ของมันดังนี้: div#tbl-container { width: 600px; overflow: auto; scrollbar-base-color:#ffeaff } สิ่งนี้ให้ฉันทั้งแถบเลื่อนแนวนอนและแนวตั้งโดยอัตโนมัติเมื่อฉันเติมตารางของฉันซึ่งมีอยู่ใน div นี้ ฉันแค่ต้องการให้แถบเลื่อนแนวนอนเท่านั้นปรากฏขึ้นโดยอัตโนมัติ ฉันจะแก้ไขความสูงของตารางโดยทางโปรแกรม ฉันจะทำสิ่งนี้ได้อย่างไร
200 css  html 

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