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

6

การเปลี่ยนพื้นหลัง three.js เป็นสีโปร่งใสหรือสีอื่น ๆ

ฉันพยายามเปลี่ยนสิ่งที่ดูเหมือนจะเป็นสีพื้นหลังเริ่มต้นของผืนผ้าใบของฉันจากสีดำเป็นสีโปร่งใส / สีอื่น ๆ - แต่ไม่มีโชค HTML ของฉัน: <canvas id="canvasColor"> CSS ของฉัน: <style type="text/css"> #canvasColor { z-index: 998; opacity:1; background: red; } </style> ดังที่คุณเห็นในตัวอย่างออนไลน์ต่อไปนี้ฉันมีแอนิเมชั่นบางส่วนต่อท้ายผืนผ้าใบดังนั้นจึงไม่สามารถทำทึบได้: 0; บน id. ดูตัวอย่างสด: http://devsgs.com/preview/test/particle/ มีความคิดอย่างไรในการเขียนทับสีดำเริ่มต้น?

122 css html canvas html5-canvas three.js

10

เส้นแนวนอนและวิธีที่ถูกต้องในการเขียนโค้ดใน html, css

ฉันต้องวาดเส้นแนวนอนหลังจากบล็อกบางส่วนและฉันมีสามวิธีในการทำ: 1) กำหนดคลาสh_lineและเพิ่มคุณสมบัติ css เข้าไปเช่น #css .hline { width:100%; height:1px; background: #fff } #html <div class="block_1">Lorem</div> <div class="h_line"></div> 2) ใช้hrแท็ก #css hr { width:100%; height:1px; background: #fff } #html <div class="block_1">Lorem</div> <hr /> 3) ใช้มันเหมือนafterpseudoclass #css .hline:after { width:100%; height:1px; background: #fff; content:"" } #html <div class="block_1 h_line">Lorem</div> วิธีใดปฏิบัติได้จริงที่สุด?

122 html css

8

การรวม CSS Pseudo-elements“: after” the“: last-child”

ฉันต้องการสร้างรายการที่ "ถูกต้องตามหลักไวยากรณ์" โดยใช้ CSS นี่คือสิ่งที่ฉันมีจนถึงตอนนี้: <li>แท็กจะแสดงในแนวนอนด้วยเครื่องหมายจุลภาคหลังจากที่พวกเขา li { display: inline; list-style-type: none; } li:after { content: ", "; } ได้ผล แต่ฉันต้องการให้ "ลูกคนสุดท้าย" มีเครื่องหมายจุดแทนเครื่องหมายจุลภาค และถ้าเป็นไปได้ฉันต้องการใส่ "และ" ก่อน "ลูกคนสุดท้าย" ด้วย รายการที่ฉันจัดสไตล์ถูกสร้างขึ้นแบบไดนามิกดังนั้นฉันจึงไม่สามารถให้ชั้นเรียน "เด็กคนสุดท้าย" ได้ คุณไม่สามารถรวมองค์ประกอบหลอกได้ แต่นั่นคือเอฟเฟกต์ที่ฉันต้องการบรรลุ li:last-child li:before { content: "and "; } li:last-child li:after { content: "."; } ฉันจะทำงานนี้ได้อย่างไร

122 css

6

ตัวยึด Mixin SCSS / CSS

ฉันกำลังพยายามสร้าง mixin สำหรับตัวยึดตำแหน่งใน sass นี่คือมิกซ์อินที่ฉันสร้างขึ้น @mixin placeholder ($css) { ::-webkit-input-placeholder {$css} :-moz-placeholder {$css} ::-moz-placeholder {$css} :-ms-input-placeholder {$css} } นี่คือวิธีที่ฉันต้องการรวมมิกซ์อิน: @include placeholder(font-style:italic; color: white; font-weight:100;); เห็นได้ชัดว่าสิ่งนี้จะไม่ได้ผลเพราะเครื่องหมายทวิภาคและเซมิโคลอนทั้งหมดที่ส่งผ่านไปยังมิกซ์อิน แต่ ... ฉันต้องการแค่ใส่ static css แล้วส่งผ่านเหมือนกับฟังก์ชันข้างต้น เป็นไปได้หรือไม่

122 css sass

14

จะเปลี่ยนรูปแบบเส้นขอบของช่องทำเครื่องหมายใน CSS ได้อย่างไร

ฉันจะเปลี่ยนรูปแบบของเส้นขอบของช่องทำเครื่องหมาย (อินพุต) ได้อย่างไร ฉันใส่border:1px solid #1e5180ไปแล้ว แต่ใน FireFox 3.5 ไม่มีอะไรเกิดขึ้น!

122 html css

9

รักษาอัตราส่วนของ div แต่เติมความกว้างและความสูงของหน้าจอใน CSS?

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

122 html css responsive-design aspect-ratio

6

Calc of max หรือ max ของ Calc ใน CSS

เป็นไปได้ไหมที่จะทำสิ่งนี้ max-width: calc(max(500px, 100% - 80px)) หรือ max-width: max(500px, calc(100% - 80px))) ใน CSS?

122 css

24

เมนูที่ยุบ Bootstrap 3 ไม่ปิดเมื่อคลิก

ฉันมีการนำทางมาตรฐานมากหรือน้อยจาก bootstrap 3 <body data-spy="scroll" data-target=".navbar-collapse">  <div class="navbar navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> </button> <a class="navbar-brand" href="index.html"> <img src="#"></a> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li class="active"><a href="#home">Home</a></li> <li><a href="#one">One</a></li> <li><a href="#two">Two</a></li> <li><a href="#three">Three</a></li> …

122 html css twitter-bootstrap navigation

10

การจัดรูปแบบตัวเลข (ตำแหน่งทศนิยมตัวคั่นหลักพัน ฯลฯ ) ด้วย CSS

เป็นไปได้ไหมที่จะจัดรูปแบบตัวเลขด้วย CSS นั่นคือตำแหน่งทศนิยมตัวคั่นทศนิยมตัวคั่นหลักพัน ฯลฯ

122 css number-formatting

13

การเปลี่ยนภาพพื้นหลัง CSS3

ฉันกำลังพยายามสร้างเอฟเฟกต์ "จางหายไป" โดยใช้การเปลี่ยน CSS แต่ฉันไม่สามารถใช้งานกับภาพพื้นหลังได้ ... CSS: .title a { display: block; width: 340px; height: 338px; color: black; background: transparent; /* TRANSITION */ -webkit-transition: background 1s; -moz-transition: background 1s; -o-transition: background 1s; transition: background 1s; } .title a:hover { background: transparent; background: url(https://lh3.googleusercontent.com/-p1nr1fkWKUo/T0zUp5CLO3I/AAAAAAAAAWg/jDiQ0cUBuKA/s800/red-pattern.png) repeat; /* TRANSITION */ -webkit-transition: background 1s; …

122 css background background-image css-transitions

4

ต่อท้ายองค์ประกอบที่มีเอฟเฟกต์จาง [jQuery]

var html = "<div id='blah'>Hello stuff here</div>" $("#mycontent").append(html).fadeIn(999); ดูเหมือนจะไม่ได้ผล ฉันแค่อยากได้เอฟเฟกต์เจ๋ง ๆ เมื่อเนื้อหาถูกต่อท้าย หมายเหตุ: ฉันต้องการให้ div "blah" ใหม่จางลงไม่ใช่ "mycontent" ทั้งหมด

121 javascript jquery html css

3

คำนวณเปอร์เซ็นต์ด้วย SCSS / SASS

ฉันต้องการกำหนดความกว้างเป็นเปอร์เซ็นต์ใน scss ผ่านการคำนวณ แต่มันทำให้ฉันมีข้อผิดพลาด .. CSS ไม่ถูกต้องหลัง "...- width: (4/12)%": นิพจน์ที่คาดหวัง (เช่น 1px ตัวหนา) คือ ";" ฉันต้องการทำสิ่งที่ชอบ $my_width: (4/12)%; div{ width: $my_width; } ฉันจะเพิ่ม% sign in ที่นั่นได้อย่างไร คำถามเดียวกันกับ px และ em

121 css sass

4

วิธีทำให้ Div มีความสูงในขณะที่ลอยอยู่ภายใน

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

121 css html overflow css-float

7

มีวิธีตรวจสอบรูปแบบ CSS ที่ใช้หรือไม่ได้ใช้บนหน้าเว็บหรือไม่?

อยากทราบว่า CSS สไตล์ไหนที่กำลังใช้งานบนหน้าเว็บ

121 css

7

angular 2 ngIf และ CSS การเปลี่ยน / ภาพเคลื่อนไหว

ฉันต้องการให้ div เลื่อนเข้ามาจากด้านขวาในเชิงมุม 2 โดยใช้ css <div class="note" [ngClass]="{'transition':show}" *ngIf="show"> <p> Notes</p> </div> <button class="btn btn-default" (click)="toggle(show)">Toggle</button> ฉันจะทำงานได้ดีถ้าฉันใช้ [ngClass] เพื่อสลับคลาสและใช้ความทึบ แต่ฉันไม่ต้องการให้องค์ประกอบนั้นแสดงผลตั้งแต่ต้นดังนั้นฉันจึง "ซ่อน" ด้วย ngIf ก่อน แต่การเปลี่ยนแปลงจะไม่ได้ผล .transition{ -webkit-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; -moz-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out; -ms-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out ; -o-transition: opacity 1000ms ease-in-out,margin-left …

121 css angular angular-animations

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