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

ฉันจะตั้งค่าสีพื้นหลัง CSS ขององค์ประกอบ HTML โดยใช้ JavaScript ได้อย่างไร

116 javascript  css  background-color 

ฉันต้องการส่งคืนสตริงที่มีเนื้อหาทั้งหมดของกฎ CSS เช่นเดียวกับรูปแบบที่คุณเห็นในสไตล์อินไลน์ ฉันต้องการที่จะทำได้โดยที่ไม่รู้ว่ามีอะไรอยู่ในกฎใดกฎหนึ่งดังนั้นฉันจึงไม่สามารถดึงมันออกมาตามชื่อสไตล์ได้ (เช่น.style.widthฯลฯ ) CSS: .test { width:80px; height:50px; background-color:#808080; } รหัสจนถึงตอนนี้: function getStyle(className) { var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules for(var x=0;x<classes.length;x++) { if(classes[x].selectorText==className) { //this is where I can collect the style information, but how? } } } getStyle('.test')

116 javascript  html  css 

เป็นไปได้หรือไม่ที่จะซ้อน DIV หลายรายการเช่น: <div> <div></div> <div></div> <div></div> <div></div> </div> เพื่อให้ DIV ภายในทั้งหมดมีตำแหน่ง X และ Y เท่ากัน? โดยค่าเริ่มต้นพวกเขาทั้งหมดจะอยู่ด้านล่างซึ่งกันและกันโดยเพิ่มตำแหน่ง Y ตามความสูงของ DIV ก่อนหน้าล่าสุด ฉันรู้สึกว่าลอยหรือโชว์หรือกลเม็ดอื่น ๆ อาจกัดได้? แก้ไข: DIV หลักมีตำแหน่งที่สัมพันธ์กันดังนั้นการใช้ตำแหน่งสัมบูรณ์ดูเหมือนจะไม่ได้ผล

116 css  html  stack  css-float 

ฉันมีคลาส CSS Modalที่อยู่ในตำแหน่งที่แน่นอนดัชนี z อยู่เหนือระดับแม่และอยู่ในตำแหน่งที่ดีกับ JQuery ฉันต้องการเพิ่มรูปคาเร็ต (^) ที่ด้านบนของกล่องโมดอลและกำลังดูการใช้:beforeตัวเลือกหลอก CSS เพื่อทำสิ่งนี้อย่างหมดจด รูปภาพจะต้องอยู่ในตำแหน่งที่แน่นอนและดัชนี z เหนือโมดอล แต่ฉันไม่พบวิธีใดในการเพิ่มคลาสที่เหมาะสมให้กับรูปภาพในcontentแอตทริบิวต์: .Modal:before{ content:url('blackCarrot.png') /* with class ModalCarrot ??*/ } .ModalCarrot{ position:absolute; left:50%; margin-left:-8px; top:-16px; } ตัวเลือกที่สองที่ดีที่สุด - ฉันสามารถเพิ่มสไตล์อินไลน์ในแอตทริบิวต์เนื้อหาได้หรือไม่

116 css  modal-dialog  pseudo-element 

เป็นไปได้ไหมที่จะมีหลาย:beforeหลอกสำหรับองค์ประกอบเดียวกัน? .circle:before { content: "\25CF"; font-size: 19px; } .now:before{ content: "Now"; font-size: 19px; color: black; } ฉันพยายามใช้สไตล์ข้างต้นกับองค์ประกอบเดียวกันโดยใช้ jQuery แต่จะใช้เฉพาะรูปแบบล่าสุดเท่านั้นไม่เคยใช้ทั้งสองแบบ

116 css  css-selectors  pseudo-element  css-content 

มีวิธีใดบ้างที่จะตรงกันข้ามกับการ:hover ใช้ CSS เพียงอย่างเดียว ? ในขณะที่ถ้า:hoverเป็นon Mouse Enterจะมี CSS เทียบเท่ากับon Mouse Leave? ตัวอย่าง: ฉันมีเมนู HTML ที่ใช้รายการ เมื่อฉันโฉบหนึ่งในรายการที่มีภาพเคลื่อนไหวสี CSS จากไป#999 blackฉันสามารถสร้างผลในทางตรงกันข้ามเมื่อเมาส์ใบพื้นที่รายการที่มีภาพเคลื่อนไหวจากblackไป#999? jsFiddle (โปรดทราบว่าฉันไม่ต้องการตอบเฉพาะตัวอย่างนี้ แต่เป็นปัญหา "ตรงข้าม:hover" ทั้งหมด)

116 css  hover 

ช่องทำเครื่องหมายมาตรฐานที่แสดงในเบราว์เซอร์ส่วนใหญ่มีขนาดค่อนข้างเล็กและไม่เพิ่มขนาดแม้ว่าจะใช้แบบอักษรขนาดใหญ่ วิธีใดที่ดีที่สุดและไม่ขึ้นกับเบราว์เซอร์ในการแสดงช่องทำเครื่องหมายขนาดใหญ่

116 html  css  checkbox 

ยกโทษให้ฉันนี่เป็นคำถามโง่ ๆ แต่ฉันต้องการความช่วยเหลือ ฉันต้องการเปลี่ยนสีเส้นขอบของ TEXTAREA เมื่อโฟกัส แต่ดูเหมือนว่ารหัสของฉันจะทำงานไม่ถูกต้อง รหัสมุมมองความกรุณาในซอ <form name = "myform" method = "post" action="insert.php" onsubmit="return validateform()" style="width:40%"> <input type="text" placeholder="Enter Name." name="name" maxlength="300" class="input"> <input type="email" placeholder="Enter E-mail." name="address" maxlength="300" class="input"> <textarea placeholder="Enter Message." name="descrip" class="input" ></textarea> <br> <input class="button secondary" type=submit name="submit" value="Submit" > </form> นี่คือ CSS …

116 html  css 

สิ่งนี้ดูเหมือนจะไม่สำคัญ แต่หลังจากการวิจัยและการเข้ารหัสทั้งหมดฉันไม่สามารถใช้งานได้ เงื่อนไขคือ: ไม่ทราบขนาดหน้าต่างเบราว์เซอร์ ดังนั้นโปรดอย่าเสนอโซลูชันที่เกี่ยวข้องกับขนาดพิกเซลที่แน่นอน ไม่ทราบขนาดดั้งเดิมของรูปภาพและอาจพอดีหรือไม่พอดีกับหน้าต่างเบราว์เซอร์ ภาพอยู่กึ่งกลางแนวตั้งและแนวนอน สัดส่วนของภาพต้องได้รับการอนุรักษ์ ภาพจะต้องแสดงอย่างครบถ้วนในหน้าต่าง (ไม่มีการครอบตัด) ฉันไม่ต้องการให้แถบเลื่อนปรากฏขึ้น (และไม่ควรใช้หากภาพพอดี) รูปภาพจะปรับขนาดโดยอัตโนมัติเมื่อขนาดของหน้าต่างเปลี่ยนไปเพื่อใช้พื้นที่ว่างทั้งหมดโดยไม่ต้องใหญ่กว่าขนาดเดิม โดยทั่วไปสิ่งที่ฉันต้องการคือ: .fit { max-width: 99%; max-height: 99%; } <img class="fit" src="pic.png"> ปัญหาเกี่ยวกับโค้ดด้านบนคือมันใช้งานไม่ได้: รูปภาพใช้พื้นที่แนวตั้งทั้งหมดที่ต้องการโดยการเพิ่มแถบเลื่อนแนวตั้ง ในการกำจัดของฉันคือ PHP, Javascript, JQuery แต่ฉันจะฆ่าด้วยโซลูชัน CSS เท่านั้น ฉันไม่สนใจว่ามันจะใช้ไม่ได้ใน IE

116 html  css 

ฉันมีแถบนำทางแบบแท็บซึ่งฉันต้องการให้แท็บที่เปิดอยู่มีเงาเพื่อตั้งค่าให้แตกต่างจากแท็บอื่น ๆ ฉันต้องการให้ส่วนแท็บทั้งหมดมีเงาเดียว (ดูเส้นแนวนอนด้านล่าง) ขึ้นไปแรเงาด้านล่างของแท็บทั้งหมดยกเว้นส่วนที่เปิดอยู่ ฉันจะใช้box-shadowคุณสมบัติของ CSS3 แต่ฉันไม่สามารถหาวิธีแรเงาเฉพาะส่วนที่ฉันต้องการได้ โดยปกติฉันจะปกปิดเงาด้านล่างของแท็บที่เปิดด้วยพื้นที่เนื้อหา (สูงกว่าz-index) แต่ในกรณีนี้พื้นที่เนื้อหาจะมีเงาเพื่อที่จะปิดทับแท็บ เค้าโครงแท็บ _______ _______ _______ | | | | | | ____ | _______ | __ | | __ | _______ | ______ เส้นเงา เงาจะขึ้นจากเส้นแนวนอนและออกไปด้านนอกของเส้นแนวตั้ง _______ | | _______________ | | _________________ นี่คือตัวอย่างสด: มีความช่วยเหลืออะไรบ้างอัจฉริยะ?

115 html  css  shadow 

.item:hover { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; -webkit-transition: opacity .15s ease-in-out; -moz-transition: opacity .15s ease-in-out; -ms-transition: opacity .15s ease-in-out; -o-transition: opacity .15s ease-in-out; transition: opacity .15s ease-in-out; } เหตุใดสิ่งนี้จึงเคลื่อนไหวเฉพาะความทึบเมื่อฉันวางเมาส์ไว้ แต่ไม่ใช่เมื่อฉันปล่อยวัตถุด้วยเมาส์ สาธิตที่นี่: http://jsfiddle.net/7uR8z/ ​

115 css  css-transitions 

เครื่องหมายทวิภาคคู่ ( ::) ใน CSS หมายถึงอะไร? ตัวอย่างเช่น: input[type=text]::-ms-clear { display: none; }

115 css 

ฉันพบว่าหากมีaลิงก์ในหน้าซึ่งไม่ได้เชื่อมโยงไปยังหน้าใหม่จากนั้นเมื่อผู้ใช้คลิกจะมีเส้นประรอบองค์ประกอบนั้นจะหายไปก็ต่อเมื่อผู้ใช้คลิกสิ่งอื่นในหน้าวิธีการ เพื่อลบสิ่งนี้? ตัวอย่าง: Section 2หมายเหตุเส้นประรอบองค์ประกอบ

115 html  css 

ฉันมีรายการสั่งซื้อที่ฉันต้องการให้หมายเลขเริ่มต้นเป็น 6 ฉันพบว่าสิ่งนี้ได้รับการสนับสนุน (เลิกใช้แล้วในขณะนี้) ใน HTML 4.01 ในข้อกำหนดนี้ระบุว่าคุณสามารถระบุจำนวนเต็มเริ่มต้นได้โดยใช้ CSS (แทนstartแอตทริบิวต์) คุณจะระบุหมายเลขเริ่มต้นด้วย CSS ได้อย่างไร?

115 html  css  html-lists 

ฉันกำลังสร้างเว็บไซต์ที่ฉันต้องการใช้แถบเลื่อนช่วง (ฉันรู้ว่ามันรองรับเฉพาะเบราว์เซอร์ webkit) ฉันได้รวมเข้าด้วยกันอย่างสมบูรณ์และใช้งานได้ดี แต่ฉันต้องการใช้textboxเพื่อแสดงค่าสไลด์ปัจจุบัน ฉันหมายถึงถ้าในตอนแรกแถบเลื่อนอยู่ที่ค่า 5 ดังนั้นในกล่องข้อความควรแสดงเป็น 5 เมื่อฉันเลื่อนค่าในกล่องข้อความควรเปลี่ยน ฉันสามารถทำได้โดยใช้เพียงCSSหรือhtml. JQueryฉันต้องการที่จะหลีกเลี่ยง เป็นไปได้ไหม?

115 html  css  range