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

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

15
การแทนที่ข้อความ H1 ด้วยภาพโลโก้: วิธีที่ดีที่สุดสำหรับ SEO และการเข้าถึง?
ดูเหมือนว่ามีเทคนิคที่แตกต่างกันออกไปดังนั้นฉันหวังว่าจะได้คำตอบที่ "ชัดเจน" ในเรื่องนี้ ... ในเว็บไซต์เป็นเรื่องธรรมดาที่จะต้องสร้างโลโก้ที่เชื่อมโยงไปยังหน้าแรก ฉันต้องการทำสิ่งเดียวกันในขณะที่ปรับให้เหมาะสมที่สุดสำหรับเครื่องมือค้นหาโปรแกรมอ่านหน้าจอ IE 6+ และเบราว์เซอร์ที่ปิดใช้งาน CSS และ / หรือรูปภาพ ตัวอย่างที่หนึ่ง:ไม่ใช้แท็ก h1 ไม่ดีสำหรับ SEO ใช่ไหม <div id="logo"> <a href=""> <img src="logo.png" alt="Stack Overflow" /> </a> </div> ตัวอย่างที่สอง:พบสิ่งนี้ที่ไหนสักแห่ง CSS ดูเหมือนแฮ็คเล็กน้อย <h1 id="logo"> <a href="">Stack Overflow</a> </h1> /* css */ #logo { padding: 70px 0 0 0; overflow: hidden; …
240 css  xhtml  image  seo 
14
มีขนาดเท่ากับพื้นหลัง: ครอบคลุมและมีสำหรับองค์ประกอบภาพหรือไม่
Наэтотвопросестьответына กองมากเกินнарусском : Естьлианалогพื้นหลัง-size: ปกдля img? ฉันมีเว็บไซต์ที่มีหลายหน้าและภาพพื้นหลังที่แตกต่างกันและฉันจะแสดงพวกเขาจาก CSS เช่น: body.page-8 { background: url("../img/pic.jpg") no-repeat scroll center top #000; background-size: cover; } อย่างไรก็ตามฉันต้องการแสดงรูปภาพ (แบบเต็มหน้าจอ) ที่แตกต่างกันในหน้าเดียวโดยใช้<img>องค์ประกอบและฉันต้องการให้มีคุณสมบัติเดียวกันกับคุณสมบัติด้านบน background-image: cover;(ภาพที่ไม่สามารถแสดงได้จาก CSS จะต้องแสดงจากเอกสาร HTML) ปกติฉันจะใช้: div.mydiv img { width: 100%; } หรือ: div.mydiv img { width: auto; } เพื่อให้ภาพเต็มและตอบสนอง อย่างไรก็ตามภาพหดตัวมากเกินไป ( width: 100%) เมื่อหน้าจอแคบเกินไปและแสดงสีพื้นหลังของร่างกายในหน้าจอด้านล่าง วิธีอื่นwidth: …
240 html  image  css 
6
ตรวจสอบโดยใช้ jQuery หากองค์ประกอบคือ 'display: none' หรือบล็อกเมื่อคลิก
ฉันต้องการตรวจสอบและจัดเรียงองค์ประกอบที่ซ่อนอยู่ เป็นไปได้หรือไม่ที่จะหาองค์ประกอบทั้งหมดที่มีคุณลักษณะdisplayและความคุ้มค่าnone?
239 jquery  css 
7
ฉันจะทำให้ไกลโคเจนใหญ่ขึ้นได้อย่างไร (เปลี่ยนขนาดหรือไม่)
ฉันต้องการทำให้ glyphicon โลกใหญ่ขึ้นเพื่อให้ครอบคลุมส่วนใหญ่ของหน้า (เป็นภาพเวกเตอร์) มันไม่ได้อยู่ในปุ่มหรืออะไรเลย มันเป็นเพียงอย่างเดียว มีวิธีทำเช่นนี้หรือไม่? <div class = "jumbotron"> <span class="glyphicon glyphicon-globe"></span> </div>
8
ทำไมองค์ประกอบแบบอินไลน์บล็อกถูกผลักลง
ต่อไปนี้เป็นรหัสของฉันและฉันต้องการที่จะเข้าใจว่าทำไม #firstDiv ถูกผลักลงเบราว์เซอร์ทั้งหมด ฉันต้องการที่จะเข้าใจการทำงานภายในของความจริงที่ว่าทำไมมันถูกผลักลงมามากกว่าที่จะดึงมันขึ้นมาโดยวิธีใดวิธีหนึ่ง (และฉันรู้วิธีจัดอันดับเสื้อของพวกเขา :)) และฉันรู้ว่ามันล้น: ซ่อนซึ่งก่อให้เกิด แต่ไม่แน่ใจว่าทำไมมันผลักดัน div ที่ลง body { width: 350px; margin: 0px auto; } #container { border: 15px solid orange; } #firstDiv { border: 10px solid brown; display: inline-block; width: 70px; overflow: hidden; } #secondDiv { border: 10px solid skyblue; float: left; width: 70px; } …
238 overflow  css 
12
คำแนะนำสำหรับการดีบักสไตล์การพิมพ์หรือไม่
เมื่อไม่นานมานี้ฉันกำลังทำงานกับสไตล์การพิมพ์สำหรับเว็บไซต์และฉันรู้ว่าฉันกำลังสูญเสียวิธีที่มีประสิทธิภาพในการปรับแต่ง เป็นสิ่งหนึ่งที่ต้องมีวงจรการรีโหลดสำหรับการทำงานบนเค้าโครงบนหน้าจอ: เปลี่ยนรหัส คำสั่งแท็บ โหลด แต่กระบวนการทั้งหมดนั้นจะยากลำบากกว่าเดิมเมื่อคุณพยายามพิมพ์: เปลี่ยนรหัส คำสั่งแท็บ โหลด พิมพ์ เหล่ที่รูปภาพตัวอย่างก่อนพิมพ์ เปิด PDF ในหน้าตัวอย่างเพื่อตรวจสอบเพิ่มเติม มีเครื่องมือที่ฉันขาดหายไปที่นี่? ผู้ตรวจสอบของ WebKit มีช่องทำเครื่องหมาย "แกล้งเป็นสื่อเพจ" หรือไม่ มีเวทมนต์ที่ Firebug ( ตัวสั่น ) ทำอะไรได้บ้าง?
17
iframe แบบเต็มหน้าจอที่มีความสูง 100%
iframe height = 100% รองรับในทุกเบราว์เซอร์หรือไม่? ฉันใช้ doctype เป็น: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ในรหัส iframe ของฉันถ้าฉันพูดว่า: <iframe src="xyz.pdf" width="100%" height="100%" /> ฉันหมายถึงจะใช้ความสูงของหน้าที่เหลืออยู่ (เนื่องจากมีอีกเฟรมหนึ่งที่ด้านบนมีความสูงคงที่ที่ 50px) นี่รองรับเบราว์เซอร์หลักทั้งหมด (IE / Firefox / Safari) หรือไม่ นอกจากนี้เกี่ยวกับแถบเลื่อนแม้ว่าฉันจะบอกว่าscrolling="no"ฉันเห็นแถบเลื่อนปิดการใช้งานใน Firefox ... ฉันจะซ่อนแถบเลื่อนและตั้งค่าความสูงของ iframe โดยอัตโนมัติได้อย่างไร
17
ฉันจะปรับขนาดเนื้อหาของ iframe ได้อย่างไร
ฉันจะปรับขนาดเนื้อหาของ iframe ได้อย่างไร (ในตัวอย่างของฉันคือหน้า HTML และไม่ใช่ป๊อปอัป) ในหน้าเว็บไซต์ของฉัน ตัวอย่างเช่นฉันต้องการแสดงเนื้อหาที่ปรากฏใน iframe ที่ 80% ของขนาดดั้งเดิม
237 html  css  dom 
8
วิธีการตั้งค่าระยะขอบหรือช่องว่างภายในเป็นเปอร์เซ็นต์ของความสูงของคอนเทนเนอร์หลัก?
ฉันได้รับสมองของฉันมากกว่าการสร้างการจัดตำแหน่งแนวตั้งใน CSS โดยใช้ต่อไปนี้ .base{ background-color:green; width:200px; height:200px; overflow:auto; position:relative; } .vert-align{ padding-top:50%; height:50%; } <!-- and used the following div structure. --> <div class="base"> <div class="vert-align"> Content Here </div> </div> เรียกใช้ข้อมูลโค้ดซ่อนผลลัพธ์ขยายตัวอย่างข้อมูล ในขณะที่สิ่งนี้ดูเหมือนจะใช้ได้กับกรณีนี้ฉันรู้สึกประหลาดใจที่เมื่อฉันเพิ่มหรือลดความกว้างของ div พื้นฐานของฉันการจัดตำแหน่งแนวตั้งจะ snap ฉันคาดหวังว่าเมื่อฉันตั้งค่าคุณสมบัติการเติมด้านบนจะใช้การเติมเป็นเปอร์เซ็นต์ของความสูงของคอนเทนเนอร์หลักซึ่งเป็นฐานในกรณีของเรา แต่ค่าที่สูงกว่า 50 เปอร์เซ็นต์จะถูกคำนวณเป็นเปอร์เซ็นต์ของ ความกว้าง :( มีวิธีตั้ง padding และ / หรือ margin เป็นเปอร์เซ็นต์ของส่วนสูงโดยไม่ต้องใช้ JavaScript หรือไม่?
9
จะระบุตัวแบ่งบรรทัดในเค้าโครงเฟล็กบ็อกซ์หลายบรรทัดได้อย่างไร?
Наэтотвопросестьответына Stack Overflow нарусском : รายการ Flexbox - переноснановуюстроку มีวิธีการแบ่งบรรทัดในหลายบรรทัด flexbox หรือไม่ ตัวอย่างเช่นการแตกหลังแต่ละรายการที่ 3 ในCodePenนี้ .container { background: tomato; display: flex; flex-flow: row wrap; align-content: space-between; justify-content: space-between; } .item { width: 100px; height: 100px; background: gold; border: 1px solid black; font-size: 30px; line-height: 100px; text-align: center; margin: 10px; } …
236 html  css  flexbox 
7
CSS: วิธีการลบองค์ประกอบหลอก (หลังจาก, ก่อน, ... )?
ฉันต้องการใช้สวิตช์สำหรับเลย์เอาต์ของแท็กวรรคบนหน้าเว็บ ฉันใช้ pseudoelement หลัง: p:after {content: url("../img/paragraph.gif");} ตอนนี้ฉันต้องลบรหัส CSS นี้ออกจากหน้า สิ่งนี้สามารถทำได้อย่างง่ายดาย? ฉันต้องการเพิ่ม: jQuery มีการใช้งานบนหน้านี้แล้ว และฉันไม่ต้องการรวมหรือลบไฟล์ที่มี CSS
3
sass - ดูด้วยการลดขนาดอัตโนมัติ?
มีวิธีการทำงานหรือไม่: sass --watch a.scss:a.css แต่a.cssท้ายที่สุดก็ถูกย่อให้เล็กลง? ฉันจะหลีกเลี่ยงการเรียกใช้ขั้นตอนการลดขนาดแยกต่างหากเมื่อฉันรวบรวมสไตล์ชีทของฉันได้อย่างไร
235 css  sass  minify 
21
วิธีซ่อนองค์ประกอบโดยใช้ Twitter Bootstrap และแสดงโดยใช้ jQuery
สมมติว่าฉันสร้างองค์ประกอบ HTML เช่นนี้ <div id="my-div" class="hidden">Hello, TB3</div> <div id="my-div" class="hide">Hello, TB4</div> <div id="my-div" class="d-none">Hello, TB4</div> ฉันจะแสดงและซ่อนองค์ประกอบ HTML นั้นจาก jQuery / Javascript ได้อย่างไร JavaScript: $(function(){ $("#my-div").show(); }); ผลลัพธ์: (กับสิ่งเหล่านี้) ฉันต้องการซ่อนองค์ประกอบด้านบน วิธีที่ง่ายที่สุดในการซ่อนองค์ประกอบโดยใช้ Bootstrap และแสดงโดยใช้ jQuery คืออะไร
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.