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

4

ทำไม <big> ไม่อยู่ใน HTML 5 Tag list ในขณะที่ <small> คือ?

ไม่ควรลบทั้งสองอย่าง? หรือหมายความว่าเราควรใช้<small>? ทำไมถึง<big>เอาออก แต่<small>ไม่ใช่? ปัญหา<big>ที่ใช้ไม่ได้กับ<small>อะไร? http://www.w3schools.com/html5/html5_reference.asp

101 css xhtml web-standards semantic-markup html

6

Webfonts หรือแบบอักษรที่โหลดในเครื่อง?

นับตั้งแต่เกิดปัญหาโดยใช้Cufonฉันก็พยายามหลีกเลี่ยงการใช้ทรัพยากรแบบอักษรภายนอก แต่เมื่อถึงช่วงปลายฉันได้มองหาวิธีอื่นในการโหลดฟอนต์เพื่อดูว่ามีวิธีที่ดีกว่านี้หรือไม่ วิธีการที่ดีกว่ามีวิธีเพียงแค่โผล่ออกมาจากสีน้ำเงิน มีวิธีการใหม่ ๆ มากมายและดูเหมือนว่าจะมีรูปแบบต่างๆสำหรับแต่ละวิธี ฉันควรใช้typekitหรือไม่? หรือgoogle webfonts (ด้วย js หรือ css)? ฉันควรใช้ฟอนต์โหลดในเครื่องต่อไปหรือไม่ (เช่นวิธีสร้างแบบอักษร Fontquirrel.com) ฉันจะแสดงวิธีการที่ดูเหมือนจะได้รับการตอบรับดีที่สุดด้านล่างพร้อมกับการทดสอบบางอย่าง แต่การย้ายไปใช้เว็บฟอนต์นั้นคุ้มค่าหรือไม่? ดูเหมือนว่าจะมีการโหลดทรัพยากรที่สูงขึ้น (คำขอ http) และมีประเภทรูปแบบไฟล์น้อยกว่า (ความเข้ากันได้น้อยลง) เป็นต้น แต่ดูเหมือนว่าไฟล์จะโหลดแบบ async และมีประสิทธิภาพในกรณีส่วนใหญ่ เป็นเพียงเรื่องของสถานการณ์และความจำเป็น? ถ้าเป็นเช่นนั้นพวกเขาคืออะไร? มีความแตกต่างอย่างมากระหว่างวิธีการเหล่านี้หรือไม่? มีวิธีที่ดีกว่านี้ไหมที่ฉันไม่ได้ระบุไว้ อะไรคือโปร / คอนสำหรับประสิทธิภาพ? ดู? การพึ่งพา? ความเข้ากันได้? ฉันกำลังมองหาแนวทางปฏิบัติที่ดีที่สุดที่นี่จริงๆประสิทธิภาพเป็นเรื่องใหญ่ แต่ความสามารถในการปรับขนาดและใช้งานง่าย ไม่ต้องพูดถึงหน้าตา Google CSS ใช้สไตล์ชีตภายนอกเท่านั้น ใช้เฉพาะไฟล์ประเภทที่เล็กที่สุดที่เข้ากันได้ สามารถใช้@importหรือ<link>หรือนำเนื้อหาของสไตล์ชี ( @font-face) มาใส่ลงในสไตล์ชีทของคุณได้โดยตรง ผลการทดสอบ 78ms …

101 javascript css fonts webfonts

8

ภาพซ้อนทับโปร่งใสสีดำที่วางเมาส์เหนือรูปภาพด้วย CSS เท่านั้น

ฉันกำลังพยายามเพิ่มภาพซ้อนทับสีดำใสให้กับรูปภาพเมื่อใดก็ตามที่เมาส์วางเมาส์เหนือรูปภาพที่มีเพียง CSS เป็นไปได้หรือไม่ ฉันลองสิ่งนี้: http://jsfiddle.net/Zf5am/565/ แต่ฉันไม่สามารถเอา div มาแสดงได้ <div class="image"> <img src="http://www.newyorker.com/online/blogs/photobooth/NASAEarth-01.jpg" alt="" /> <div class="overlay" /> </div> .image { position: relative; border: 1px solid black; width: 200px; height: 200px; } .image img { max-width: 100%; max-height: 100%; } .overlay { position: absolute; top: 0; left: 0; display: none; background-color: …

101 css

9

รูปภาพตรงกลางในตาราง td ใน CSS

ฉันพยายามจัดรูปภาพให้อยู่ตรงกลางตาราง td ทำงานร่วมกับการตั้งค่าระยะขอบซ้ายเป็นค่าเฉพาะ แต่ก็เพิ่มขนาดของ td ด้วยและนั่นไม่ใช่สิ่งที่ฉันต้องการ มีวิธีใดที่มีประสิทธิภาพในการดำเนินการนี้หรือไม่? ฉันใช้เปอร์เซ็นต์สำหรับความสูงและความสูงของตาราง

101 html css

5

ฉันจะแทนที่สไตล์อินไลน์ด้วย CSS ภายนอกได้อย่างไร

ฉันมีมาร์กอัปที่ใช้รูปแบบอินไลน์ แต่ฉันไม่มีสิทธิ์เปลี่ยนมาร์กอัปนี้ ฉันจะแทนที่สไตล์อินไลน์ในเอกสารโดยใช้ CSS เพียงอย่างเดียวได้อย่างไร ฉันไม่ต้องการใช้ jQuery หรือ JavaScript HTML: <div style="font-size: 18px; color: red;"> Hello World, How Can I Change The Color To Blue? </div> CSS: div { color: blue; /* This Isn't Working */ }

101 css

10

ฉันจะหยุดลอยซ้ายได้อย่างไร?

ฉันมีรหัสต่อไปนี้: <div style="float: left; width: 100%;"> <label style="float: left;">ABC</label> <input style="float: left; font-size: 0.5em;" type="button" onclick="addTiny(0,'Question_Text'); return false;" value="&#x25BC;" title="Editor" /> <input style="float: left; font-size: 0.5em;" type="button" onclick="remTiny(0,'Question_Text'); return false;" value="&#x25B2;" title="Hide" /> <div class="adm"> <textarea rows="2;" style="width: 100%" class="text-box multi-line mceEditor"> abc </textarea> </div> </div> ปัญหาของฉันคือ div ที่มี class …

101 css html css-float

5

ฉันมีโค้ดตัวอย่างด้านล่าง ซึ่งใช้ได้ดีกับทุกเบราว์เซอร์ยกเว้นเบราว์เซอร์บนอุปกรณ์มือถือ แท็กล้นคือปัญหา ใช้ได้กับทุกคนยกเว้นมือถือ: margin: 0; padding: 0; height: 100%; overflow: hidden; ใช้งานได้กับมือถือทั้งหมดไม่ใช่คอมพิวเตอร์: margin: 0; padding: 0; height: 100%; อะไรคือวิธีที่ดีที่สุดในการทำให้ทั้งสองอย่างทำงาน <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Test Layout</title> <style type="text/css"> body, html { margin: 0; padding: 0; height: 100%; overflow: hidden; } </style> </head> <body> …

101 html css iframe

18

เมนู Bootstrap Dropdown ไม่ทำงาน

ฉันมีปัญหาในการทำให้ดรอปดาวน์ทำงาน ฉันสามารถทำให้แถบนำทางปรากฏขึ้นอย่างสมบูรณ์แบบ แต่เมื่อฉันคลิกที่ "ดร็อปดาวน์" (อย่างใดอย่างหนึ่ง) มันไม่แสดงเมนูแบบเลื่อนลง ฉันได้ลองค้นหาโพสต์อื่น ๆ เกี่ยวกับเรื่องนี้ แต่ไม่มีอะไรที่ช่วยแก้ปัญหาของทุกคนได้ ฉันคัดลอกแหล่งที่มาโดยตรงจากเว็บไซต์ของ bootstrap แต่ดูเหมือนจะไม่สามารถใช้งานได้กับเครื่องของฉัน ใครมีไอเดียบ้าง ฉันจ้องมองมันเป็นเวลาหนึ่งชั่วโมงแล้วและดูเหมือนจะคิดไม่ออกว่าปัญหาคืออะไร <head> <script src="resource/js/jquery-1.11.0.js"></script> <script src="resources/js/bootstrap.js"></script> <script type="text/javascript"> $(document).ready(function() { $('dropdown-toggle').dropdown() }); </script> </head> <body> <nav class="navbar navbar-default" role="navigation"> <div class="container-fluid">  <div class="navbar-header"> <button type="button" …

100 javascript jquery html css twitter-bootstrap

8

CSS การตัดคำใน div

ฉันมี div ที่มีความกว้าง 250px เมื่ออินเนอร์เท็กซ์กว้างกว่าที่ฉันต้องการให้มันพังทลาย div คือ float: ทางซ้ายและตอนนี้มี overflow ฉันต้องการให้แถบเลื่อนหายไปโดยใช้การตัดคำ ฉันจะบรรลุเป้าหมายนี้ได้อย่างไร? <div id="Treeview"> <div id="HandboekBox"> <div id="HandboekTitel"> <asp:Label ID="lblManual" runat="server"></asp:Label> </div> <div id="HandboekClose"> <asp:ImageButton ID="btnCloseManual" runat="server" ImageUrl="Graphics/close.png" onclick="btnCloseManual_Click" BorderWidth="0" ToolTip="Sluit handboek" /> </div> </div> <asp:TreeView ID="tvManual" runat="server" RootNodeStyle-CssClass="RootNode"> <Nodes> </Nodes> </asp:TreeView> </div> CSS: #Treeview { padding-right: 5px; width: 250px; …

100 css html word-wrap

5

โทรกลับในการเปลี่ยน CSS

เป็นไปได้ไหมที่จะได้รับการแจ้งเตือน (เช่นการติดต่อกลับ) เมื่อการเปลี่ยน CSS เสร็จสมบูรณ์

100 javascript css css-transitions

3

CSS: หลังจากไม่เพิ่มเนื้อหาให้กับองค์ประกอบบางอย่าง

ฉันมีปัญหาในการทำความเข้าใจพฤติกรรมของ:afterคุณสมบัติCSS ตามข้อกำหนด ( ที่นี่และที่นี่ ): ตามที่ระบุชื่อองค์ประกอบ:beforeและ:afterหลอกระบุตำแหน่งของเนื้อหาก่อนและหลังเนื้อหาโครงสร้างเอกสารขององค์ประกอบ ดูเหมือนว่าจะไม่มีข้อ จำกัด ว่าองค์ประกอบใดสามารถมีคุณสมบัติ:after(หรือ:before) ได้ แต่ก็ดูเหมือนว่าจะทำงานเฉพาะกับองค์ประกอบเฉพาะ ... <p>งาน<img>ไม่ได้<input>ไม่ได้<table>ไม่ ฉันสามารถทดสอบเพิ่มเติมได้ แต่ประเด็นคือ โปรดทราบว่าสิ่งนี้ค่อนข้างสอดคล้องกันในเบราว์เซอร์ อะไรเป็นตัวกำหนดว่าวัตถุสามารถรับ a :beforeและ:afterคุณสมบัติได้หรือไม่?

100 css pseudo-element

15

คุณสร้างปุ่มสลับได้อย่างไร?

ฉันต้องการสร้างปุ่มสลับใน html โดยใช้ css ฉันต้องการให้เมื่อคุณคลิกมันจะยังคงดันเข้าและกว่าที่คุณคลิกอีกครั้งมันจะปรากฏออกมา หากไม่มีวิธีทำเพียงแค่ใช้ css มีวิธีทำโดยใช้ jQuery หรือไม่?

100 jquery html css

11

มีสิ่งต่าง ๆ เช่น min-font-size และ max-font-size หรือไม่?

ฉันพยายามสร้างแบบอักษรใน div ที่ตอบสนองต่อหน้าต่างเบราว์เซอร์ จนถึงตอนนี้มันทำงานได้อย่างสมบูรณ์ แต่ div พาเรนต์มี a max-widthของ525px. การปรับขนาดเบราว์เซอร์เพิ่มเติมจะไม่ทำให้แบบอักษรหยุดปรับขนาด สิ่งนี้ทำให้ฉันสงสัยว่ามีสิ่งนั้นmin-font-sizeหรือmax-font-sizeและถ้าสิ่งนั้นไม่มีอยู่จริงหากมีวิธีที่จะบรรลุสิ่งที่คล้ายกัน ฉันคิดว่าการใช้เปอร์เซ็นต์font-sizeจะได้ผล แต่บิตของข้อความจะไม่ปรับขนาดตาม div ระดับบนสุด นี่คือสิ่งที่ฉันมี: CSS สำหรับ div พาเรนต์: .textField{ background-color:rgba(88, 88, 88, 0.33); width:40%; height:450px; min-width:200px; max-width:525px; z-index:2; } CSS สำหรับส่วนของข้อความที่เป็นปัญหา: .subText{ position:relative; top:-55px; left:15px; font-family:"news_gothic"; font-size:1.3vw; font-size-adjust:auto; width:90%; color:white; z-index:1; } ฉันค้นหาในอินเทอร์เน็ตมาระยะหนึ่งแล้ว แต่ก็ไม่มีประโยชน์

100 html css fonts font-size

4

ฉันจะป้องกันไม่ให้ textarea ขยายเกินองค์ประกอบ DIV หลักได้อย่างไร (ปัญหา google-chrome เท่านั้น)

ฉันจะป้องกันไม่ให้พื้นที่ข้อความขยายเกินองค์ประกอบ DIV หลักได้อย่างไร ฉันมีพื้นที่ข้อความนี้อยู่ในตารางซึ่งอยู่ภายใน DIV และดูเหมือนว่ามันจะทำให้ทั้งตารางยืดออกไปนอกขอบเขต คุณสามารถดูตัวอย่างของสถานการณ์เดียวกันได้แม้ในกรณีที่ง่ายกว่านั้นเพียงแค่ใส่พื้นที่ข้อความภายใน div (เช่นสิ่งที่ใช้ที่นี่ใน www.stackoverflow.com) คุณสามารถดูได้จากภาพด้านล่างว่า textarea สามารถขยายได้เกินขนาดของแม่หรือไม่? ฉันจะป้องกันสิ่งนี้ได้อย่างไร? ฉันยังใหม่กับ CSS ดังนั้นฉันจึงไม่รู้จริงๆว่าควรใช้แอตทริบิวต์ CSS อะไร ฉันพยายามหลายประการเช่นการแสดงผลและล้น แต่ดูเหมือนพวกเขาจะไม่ทำเคล็ดลับ มีอะไรอีกบ้างที่ฉันอาจพลาดไป? อัปเดต: HTML CSS textarea { max-width: 50%; } #container { width: 80%; border: 1px solid red; } #cont2{ width: 60%; border: 1px solid blue; } หากคุณใส่รหัสนี้ไว้ในhttp://jsfiddle.netคุณจะเห็นว่ารหัสเหล่านี้ทำงานแตกต่างกัน แม้ว่า …

100 css google-chrome textarea

9

ข้อความที่ไหลออกจาก div

เมื่อข้อความไม่มีช่องว่าง และมากกว่าขนาด div 200pxมันจะไหลออกมาความกว้างถูกกำหนดเป็น 200px ฉันใส่รหัสของฉันที่นี่http://jsfiddle.net/madhu131313/UJ6zG/ คุณสามารถดูรูปภาพด้านล่างที่ แก้ไข : ฉันต้องการ ข้อความเพื่อไปยังบรรทัดถัดไป

100 css border

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