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

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

5
วิธีการตรวจจับการวางแนวอุปกรณ์โดยใช้คิวรี่สื่อ CSS?
ใน JavaScript โหมดการวางแนวสามารถตรวจจับได้โดยใช้: if (window.innerHeight > window.innerWidth) { portrait = true; } else { portrait = false; } อย่างไรก็ตามมีวิธีตรวจจับทิศทางโดยใช้ CSS เท่านั้นหรือไม่ เช่น. สิ่งที่ต้องการ: @media only screen and (width > height) { ... }

10
CSS สามารถบังคับให้แบ่งบรรทัดหลังจากแต่ละคำในองค์ประกอบหรือไม่
ฉันกำลังสร้างเว็บไซต์ที่พูดได้หลายภาษากับเจ้าของช่วยฉันด้วยการแปลบางอย่าง วลีที่แสดงบางข้อความต้องมีตัวแบ่งบรรทัดเพื่อรักษารูปแบบของเว็บไซต์ น่าเสียดายที่เจ้าของไม่ใช่คนคอมพิวเตอร์ดังนั้นหากเขาเห็นว่าfoo<br />barมีโอกาสเขาจะแก้ไขข้อมูลในขณะที่เขากำลังแปลอยู่ มีวิธีแก้ปัญหา CSS (นอกเหนือจากการเปลี่ยนความกว้าง) เพื่อใช้กับองค์ประกอบที่จะแตกหลังจากทุกคำ? (ฉันรู้ว่าฉันสามารถทำสิ่งนี้ใน PHP ได้ แต่ฉันสงสัยว่ามีกลอุบายที่ดีที่ฉันไม่รู้จักใน CSS เพื่อทำสิ่งเดียวกันให้สำเร็จหรืออาจใช้คุณสมบัติ CJK) แก้ไข ฉันจะพยายามทำแผนภาพสิ่งที่เกิดขึ้น: ---------------- ---------------- | Short Word | | Gargantuan | | | | Word | ---------------- ---------------- คำยาวแบ่งโดยอัตโนมัติคำสั้นไม่ได้ ฉันอยากให้มันเป็นแบบนี้: ---------------- ---------------- | Short | | Gargantuan | | Word | | Word | ---------------- …
159 css  line-breaks 


9
วิธีการจัดกึ่งกลางเนื้อหาด้วยความสูงของตัวแปรภายใน div
เป็นวิธีที่ดีที่สุดในการจัดกึ่งกลางเนื้อหาของ div ในแนวตั้งเมื่อความสูงของเนื้อหาเป็นตัวแปรอะไร ในกรณีเฉพาะของฉันความสูงของ div container จะถูกแก้ไข แต่มันจะดีถ้ามีวิธีแก้ปัญหาที่จะทำงานในกรณีที่ container มีความสูงของตัวแปรเช่นกัน นอกจากนี้ฉันจะรักการแก้ปัญหาโดยไม่ใช้ CSS hacks และ / หรือมาร์กอัปที่ไม่ใช่ความหมายหรือน้อยมาก

15
วิธีรับส่วนตัวเลขของคุณสมบัติ CSS ด้วย jQuery
ฉันต้องทำการคำนวณตัวเลขตามคุณสมบัติ CSS อย่างไรก็ตามเมื่อฉันใช้สิ่งนี้เพื่อรับข้อมูล: $(this).css('marginBottom') มันคืนค่า '10px' มีเคล็ดลับที่จะเพียงแค่ได้รับส่วนจำนวนของค่าไม่ว่าไม่ว่าจะเป็นpxหรือ%หรือemหรืออะไรก็ตาม?

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

8
เค้าโครง div 2 คอลัมน์: คอลัมน์ด้านขวาที่มีความกว้างคงที่ของเหลวด้านซ้าย
ความต้องการของฉันคือง่าย: 2 คอลัมน์ที่หนึ่งที่เหมาะสมมีขนาดคงที่ น่าเสียดายที่ฉันไม่พบโซลูชันที่ใช้งานได้ทั้งใน stackoverflow และ Google แต่ละโซลูชันที่อธิบายไว้นั้นล้มเหลวหากฉันนำไปใช้ในบริบทของตัวเอง ทางออกปัจจุบันคือ: div.container { position: fixed; float: left; top: 100px; width: 100%; clear: both; } #content { margin-right: 265px; } #right { float: right; width: 225px; margin-left: -225px; } #right, #content { height: 1%; /* fixed for IE, although doesn't seem to work …
158 css  html 

8
ภาพเคลื่อนไหวปั่น CSS3
ฉันได้ดูการสาธิตไม่กี่ครั้งและไม่รู้ว่าทำไมฉันไม่สามารถหมุน CSS3 เพื่อใช้งานได้ ฉันใช้ Chrome รุ่นเสถียรล่าสุด ซอ: http://jsfiddle.net/9Ryvs/1/ div { margin: 20px; width: 100px; height: 100px; background: #f00; -webkit-animation-name: spin; -webkit-animation-duration: 40000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 40000ms; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 40000ms; -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; -o-transition: rotate(3600deg); } <div></div> เรียกใช้ข้อมูลโค้ดซ่อนผลลัพธ์ขยายตัวอย่างข้อมูล

5
ฉันจะรับคอลัมน์ Bootstrap เพื่อขยายหลายแถวได้อย่างไร
ฉันพยายามหาวิธีทำตารางต่อไปนี้ด้วย Bootstrap ฉันไม่แน่ใจว่าฉันจะสร้างกล่อง (หมายเลข 1) ที่ครอบคลุมสองแถวได้อย่างไร กล่องถูกสร้างโดยทางโปรแกรมตามลำดับที่วาง ช่อง 1 คือข้อความต้อนรับ มีความคิดเกี่ยวกับวิธีที่ดีที่สุดที่จะไปกับสิ่งนี้

9
ReactJS เพิ่มคลาสแบบไดนามิกให้กับชื่อคลาสแบบแมนนวล
ฉันต้องการเพิ่มคลาสแบบไดนามิกในรายการคลาสปกติ แต่ไม่ทราบว่า (ฉันใช้ babel) ได้อย่างไรเช่นนี้: <div className="wrapper searchDiv {this.state.something}"> ... </div> ความคิดใด ๆ
158 css  reactjs 

12
เปลี่ยนสีของ glyphicons เป็นสีน้ำเงินในบางแห่ง แต่ไม่ใช่ในทุกสถานที่โดยใช้ Bootstrap 2
ฉันใช้เฟรมเวิร์ก Bootstrap สำหรับ UI ของฉัน ฉันต้องการเปลี่ยนสีของ glyphicons เป็นสีน้ำเงิน แต่ไม่ใช่ในทุกสถานที่ ในบางสถานที่ควรใช้สีเริ่มต้น ฉันอ้างถึงลิงก์ทั้งสองนี้แล้ว แต่ฉันไม่พบว่ามีประโยชน์อะไร ฉันสามารถเพิ่มสีให้กับไอคอน bootstrap โดยใช้ CSS ได้หรือไม่ ฉันจะเปลี่ยน glyphicons ของ Bootstrap 3 เป็นสีขาวได้อย่างไร โปรดทราบ: ผมใช้เงินทุน 2.3.2

6
วิธีการทำให้แถบเครื่องมือ Twitter Bootstrap มีหลายบรรทัด?
ฉันกำลังใช้ฟังก์ชั่นด้านล่างเพื่อสร้างข้อความที่จะแสดงโดยใช้คำแนะนำเครื่องมือของ Bootstrap คำแนะนำเครื่องมือหลายอันมาพร้อมกับ<br>และไม่ได้\nอย่างไร ฉันชอบที่ไม่มี HTML ในแอตทริบิวต์ชื่อลิงค์ของฉัน งานอะไร def tooltip(object) tooltip = "" object.each do |user| tooltip += "#{user.identifier}" + "<br>" end return tooltip end สิ่งที่ฉันต้องการ def tooltip(object) tooltip = "" object.each do |user| tooltip += "#{user.identifier}" + "\n" end return tooltip end

4
ลบสไตล์ / การจัดรูปแบบทั้งหมดออกจากไฮเปอร์ลิงก์
ฉันกำลังสร้างเมนูการนำทางด้วยคำที่มีสีต่างกัน ( hrefลิงค์) ฉันต้องการสีที่จะไม่เปลี่ยนแปลงในสถานะใด ๆ (โฮเวอร์เยี่ยมชม ฯลฯ ) ฉันรู้วิธีตั้งค่าสีสำหรับสถานะต่าง ๆ แต่ฉันต้องการทราบรหัสเพื่อปล่อยสีข้อความ (และการจัดรูปแบบ / การจัดรูปแบบอื่น ๆ ) ตามที่เป็นอยู่ ข้อเสนอแนะใด ๆ
157 html  css  href 

11
สไตล์ชีทของ CSS ในลำดับใดที่จะแทนที่?
ในส่วนหัวของ HTML ฉันได้รับสิ่งนี้: <head> <title>Title</title> <link href="styles.css" rel="stylesheet" type="text/css"/> <link href="master.css" rel="stylesheet" type="text/css"/> styles.cssเป็นแผ่นงานเฉพาะหน้าของฉัน master.cssเป็นแผ่นงานที่ฉันใช้ในแต่ละโครงการของฉันเพื่อแทนที่ค่าเริ่มต้นของเบราว์เซอร์ สไตล์ชีตใดที่มีลำดับความสำคัญสูง ตัวอย่าง: ชีตแรกมีเฉพาะ body { margin:10px; } และเส้นขอบที่เกี่ยวข้อง แต่ที่สองมีการรีเซ็ตของฉัน html, body:not(input="button") { margin: 0px; padding: 0px; border: 0px; } ในสาระสำคัญองค์ประกอบ cascading ของ CSS ทำงานเหมือนกันในแง่ของการอ้างอิงสไตล์ชีทเหมือนกับใน CSS function ทั่วไปหรือไม่ หมายความว่าบรรทัดสุดท้ายเป็นบรรทัดที่แสดงหรือไม่

15
ฉันจะปรับขนาดภาพในสไปรต์ CSS ได้อย่างไร
ในบทความนี้http://css-tricks.com/css-sprites/พูดถึงว่าฉันจะครอบตัดภาพขนาดเล็กลงจากภาพขนาดใหญ่ 1 ภาพได้อย่างไร คุณช่วยบอกฉันหน่อยได้ไหมว่ามันเป็นไปได้ / ฉันจะครอบตัดรูปภาพที่เล็กลงแล้วขยายขอบเขตการครอบตัดก่อนที่จะจัดวางได้หรือไม่? นี่คือตัวอย่างจากบทความนั้น: A { background-image: url(http://www.jaredhirsch.com/coolrunnings/public_images/3deb155981/spriteme1.png); background-position: -10px -56px; } ฉันอยากรู้ว่าฉันจะขยายภาพนั้นได้อย่างไรหลังจากที่ฉันตัดภาพจาก spriteme1.png นี่คือ URL ของตัวอย่าง: http://css-tricks.com/examples/CSS-Sprites/Example1After/ ดังนั้นฉันอยากรู้ว่าฉันจะทำให้ไอคอนเล็กกว่ารายการที่ 1, 2, 3, 4 หรือไม่?
157 css  css-sprites 

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