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

12

สมมติว่ากฎมีดังนี้: .largeField { width: 65%; } มีวิธีเอาคืน '65% 'บ้างไหมและไม่ใช่ค่าพิกเซล? ขอบคุณ. แก้ไข:แต่น่าเสียดายที่ใช้วิธีการ DOM จะไม่น่าเชื่อถือในกรณีของฉันที่ฉันมีสไตล์ชีตซึ่งการนำเข้าสไตล์ชีตอื่น ๆ และเป็นผลให้cssRulesพารามิเตอร์ปลายขึ้นกับทั้งnullหรือไม่ได้กำหนดค่า อย่างไรก็ตามวิธีนี้จะใช้ได้ผลในกรณีที่ตรงไปตรงมาที่สุด (สไตล์ชีตเดียวการประกาศสไตล์ชีตแยกกันหลายรายการภายในแท็กหัวของเอกสาร)

99 jquery css

3

การใช้ style =“ clear: both” คืออะไร?

ฉันบังเอิญเห็นdivว่ามีสไตล์clear:both! ใช้clearในstyleอะไร? <div style="clear:both">

99 html css

5

เครื่องหมายดอกจัน (*) ทำอะไรในตัวเลือก CSS

ฉันพบโค้ด CSS นี้และฉันรันมันเพื่อดูว่ามันทำอะไรและมันสรุปทุกองค์ประกอบในหน้า ใครช่วยอธิบายสิ่งที่ Asterisk * ทำใน CSS ได้บ้าง <style> * { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } * * * * { outline: 2px dotted blue } * * * * * { …

99 css css-selectors

10

สอง divs หนึ่งความกว้างคงที่อีกอันที่เหลือ

ฉันมีคอนเทนเนอร์ div สองอัน ในขณะที่ความกว้างหนึ่งต้องมีความกว้างเฉพาะ แต่ฉันก็ต้องปรับมันดังนั้น div อื่นจึงใช้พื้นที่ที่เหลือ มีวิธีใดบ้างที่ฉันสามารถทำได้? .left { float: left; width: 83%; display: table-cell; vertical-align: middle; min-height: 50px; margin-right: 10px; overflow: auto; } .right { float: right; width: 16%; text-align: right; display: table-cell; vertical-align: middle; min-height: 50px; height: 100%; overflow: auto; } <div class="left"></div> <div class="right"></div> <!-- needs …

99 css html

15

ลบคลาสทั้งหมดที่ขึ้นต้นด้วยสตริงที่กำหนด

ฉันมี div id="a"ซึ่งอาจมีจำนวนคลาสที่แนบมาจากหลายกลุ่ม แต่ละกลุ่มมีคำนำหน้าเฉพาะ ในจาวาสคริปต์ฉันไม่รู้ว่าคลาสจากกลุ่มไหนอยู่บน div ฉันต้องการล้างชั้นเรียนทั้งหมดด้วยคำนำหน้าที่กำหนดแล้วเพิ่มใหม่ ถ้าฉันต้องการลบคลาสทั้งหมดที่ขึ้นต้นด้วย "bg" ฉันจะทำอย่างไร อะไรทำนองนี้ แต่ใช้งานได้จริง: $("#a").removeClass("bg*");

99 javascript jquery css

10

Thymeleaf: วิธีใช้ conditionals เพื่อเพิ่ม / ลบคลาส CSS แบบไดนามิก

การใช้Thymeleafเป็นเครื่องมือแม่แบบเป็นไปได้หรือไม่ที่จะเพิ่ม / ลบคลาส CSS แบบไดนามิกไปยัง / จากรูปแบบง่ายๆdivด้วยth:ifอนุประโยค? โดยปกติฉันสามารถใช้ประโยคเงื่อนไขดังนี้: <a href="lorem-ipsum.html" th:if="${condition}">Lorem Ipsum</a> เราจะสร้างลิงค์ไปยังเพจlorem ipsumแต่เงื่อนไขเงื่อนไขเป็นจริงเท่านั้น ฉันกำลังมองหาสิ่งที่แตกต่าง: ฉันต้องการให้บล็อกปรากฏอยู่เสมอ แต่มีคลาสที่เปลี่ยนแปลงได้ตามสถานการณ์

99 java html css spring thymeleaf

14

วิธีการวาดเส้นประด้วย css?

ฉันจะวาดเส้นประด้วย CSS ได้อย่างไร

99 html css

5

HTML / CSS: สร้าง div ให้ "มองไม่เห็น" กับการคลิกหรือไม่

ด้วยเหตุผลหลายประการฉันต้องใส่ (ส่วนใหญ่) ให้โปร่งใส<div>เหนือข้อความบางส่วน อย่างไรก็ตามหมายความว่าไม่สามารถคลิกข้อความได้ (เช่นคลิกลิงก์หรือเลือก) เป็นไปได้ไหมที่จะทำให้ div นี้ "มองไม่เห็น" ต่อการคลิกและเหตุการณ์อื่น ๆ ของเมาส์ ตัวอย่างเช่นoverlaydiv ครอบคลุมข้อความ แต่ฉันต้องการให้สามารถคลิก / เลือกข้อความผ่านoverlaydiv: <div id="container"> <p>Some text</p> <div id="overlay" style="position: absolute; top: 0; left: 0; width: 100%; height:100%"> ... some content ... </div> </div>

99 html css events

7

จัดแต่งทรงผมอีเมล HTML สำหรับ Gmail

ฉันกำลังสร้างอีเมล html ที่ใช้สไตล์ชีตภายในเช่น <!doctype html> <html> <head> <style type="text/css"> h2.foo {color: red} </style> </head> <body> <h2 class="foo">Email content here</foo> </body> </html> เมื่อดูใน Gmail ดูเหมือนว่าสไตล์ทั้งหมดในสไตล์ชีตภายในจะถูกละเว้น ดูเหมือนว่า Gmail จะละเว้นรูปแบบทั้งหมดนอกเหนือจากกฎแบบอินไลน์เช่น <h2 style="color: red">Email content here</foo> นี่เป็นตัวเลือกเดียวของฉันในการจัดรูปแบบอีเมล HTML เมื่อดูด้วย Gmail หรือไม่

99 html css gmail html-email

8

ส่วนขยายของ Google Chrome - ไม่สามารถโหลดภาพในเครื่องด้วย CSS

ฉันมีส่วนขยาย Chrome แบบธรรมดาที่ใช้คุณลักษณะสคริปต์เนื้อหาเพื่อแก้ไขเว็บไซต์ โดยเฉพาะอย่างยิ่งbackground-imageของเว็บไซต์ดังกล่าว ด้วยเหตุผลบางอย่างดูเหมือนว่าฉันไม่สามารถใช้รูปภาพในเครื่องได้แม้ว่าจะบรรจุในส่วนขยายแล้วก็ตาม body { background: #000 url('image.jpg') !important; background-repeat: repeat !important; } แค่นั้นแหละ CSS ที่ง่ายที่สุด ... แต่มันใช้ไม่ได้ เบราว์เซอร์ไม่โหลดภาพ

99 css google-chrome-extension background-image

11

วิธีการตีแบบเฉียงด้วย css

ฉันต้องการสิ่งนี้: จะบรรลุสิ่งนี้ด้วย css ได้อย่างไร? ฉันรู้ว่าวิธีหนึ่งคือใช้ภาพพื้นหลัง แต่ฉันสามารถทำได้โดยใช้ css โดยไม่มีภาพใด ๆ เท่านั้นหรือไม่

99 html css image strikethrough

8

ปรับขนาดภาพอัตโนมัติใน CSS FlexBox Layout และรักษา Aspect Ratio?

ฉันใช้เค้าโครงกล่องดิ้น CSS ซึ่งปรากฏดังที่แสดงด้านล่าง: หากหน้าจอเล็กลงจะเปลี่ยนเป็น: ปัญหาคือรูปภาพไม่ได้ถูกปรับขนาดโดยคงสัดส่วนภาพจากภาพต้นฉบับ เป็นไปได้ไหมที่จะใช้ CSS บริสุทธิ์และเค้าโครงกล่องดิ้นเพื่อให้ภาพถูกปรับขนาดหากหน้าจอเล็กลง นี่คือ html ของฉัน: <div class="content"> <div class="row"> <div class="cell"> <img src="http://i.imgur.com/OUla6mK.jpg"/> </div> <div class="cell"> <img src="http://i.imgur.com/M16WzMd.jpg"/> </div> </div> </div> CSS ของฉัน: .content { background-color: yellow; } .row { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; …

99 html css flexbox

11

หลีกเลี่ยงการแบ่งหน้าภายในแถวของตาราง

ฉันต้องการหลีกเลี่ยงการแบ่งหน้าภายในแถวของตารางใน html เมื่อฉันแปลง html เป็น PDF โดย wkhtmltopdf ฉันใช้ page-break-inside: หลีกเลี่ยงด้วย table - มันใช้งานได้ แต่ฉันมีหลายแถวแล้วไม่ทำงาน หากตั้งค่าการแสดงtr เป็นบล็อกหรืออย่างอื่นมันจะเปลี่ยนการจัดรูปแบบของตารางและใส่เส้นขอบคู่ หรือเป็นไปได้ที่จะแทรกส่วนหัวของตารางในแต่ละหน้าซึ่งตารางถูกแยกออก

99 html css wkhtmltopdf

11

เส้นขอบสองสี

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

99 css border

14

TypeError: $ (…) .modal ไม่ใช่ฟังก์ชันที่มี bootstrap Modal

ฉันมีโมดอล bootstrap 2.32 ซึ่งฉันพยายามแทรกลงใน HTML ของมุมมองอื่นแบบไดนามิก ฉันกำลังทำงานกับ Codeigniter 2.1 ต่อไปนี้การแทรกมุมมองบางส่วนของโมดอล bootstrap แบบไดนามิกลงในมุมมองฉันมี: <div id="modal_target"></div> เป็น div เป้าหมายสำหรับการแทรก ฉันมีปุ่มในมุมมองของฉันที่ดูเหมือน: <a href="#message" class="btn btn-large btn-info" data-action="Message" data-toggle="tab">Message</a> JS ของฉันมี: $.ajax({ type : 'POST', url : "AjaxUpdate/get_modal", cache : false, success : function(data){ if(data){ $('#modal_target').html(data); //This shows the modal $('#form-content').modal(); } } }); …

99 javascript jquery css twitter-bootstrap twitter-bootstrap-2

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