สีในนี้ตารางเป็นสิ่งที่ไม่โปร่งใส ผมคิดว่าค่าสำหรับการตั้งค่าที่จะA
FF
รหัสเพื่อความโปร่งใสคืออะไร?
ตัวอย่างเช่นสีนี้ FFF0F8FF (AliceBlue) เป็นรหัสโปร่งใสเช่น??F0F8FF
?
สีในนี้ตารางเป็นสิ่งที่ไม่โปร่งใส ผมคิดว่าค่าสำหรับการตั้งค่าที่จะA
FF
รหัสเพื่อความโปร่งใสคืออะไร?
ตัวอย่างเช่นสีนี้ FFF0F8FF (AliceBlue) เป็นรหัสโปร่งใสเช่น??F0F8FF
?
คำตอบ:
ความโปร่งใสถูกควบคุมโดยช่องสัญญาณอัลฟา ( AA
ใน#AARRGGBB
) ค่าสูงสุด (255 dec, FF hex) หมายถึงทึบแสงเต็มที่ ค่าต่ำสุด (0 Dec, 00 hex) หมายถึงโปร่งใสทั้งหมด ค่าในระหว่างนั้นกึ่งโปร่งใสนั่นคือสีผสมกับสีพื้นหลัง
เพื่อให้ได้สีที่โปร่งใสอย่างสมบูรณ์ตั้งค่าอัลฟาเป็นศูนย์ RR
, GG
และBB
ไม่เกี่ยวข้องในกรณีนี้เพราะสีจะไม่สามารถมองเห็นได้ ซึ่งหมายความว่า#00FFFFFF
("โปร่งใสขาว") เป็นสีเดียวกับ#00F0F8FF
("โปร่งใส AliceBlue") เพื่อให้ง่ายหนึ่งเลือกสีดำ ( #00000000
) หรือสีขาว ( #00FFFFFF
) ถ้าสีไม่สำคัญ
ในตารางที่คุณเชื่อมโยงกับการที่คุณจะพบตามที่กำหนดไว้Transparent
#00FFFFFF
7F
คือ วางเครื่องคิดเลขของคุณในโหมด hex มันจะทำเคล็ดลับสำหรับคุณ
#7FFFFFFF
สีขาว
นี่คือตาราง% ถึงค่า hex:
ตัวอย่าง : สำหรับ 85% #D9FFFFFF
สีขาวคุณจะใช้
ที่นี่ 85% = "D9" & White = "FFFFFF"
100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00
มันคำนวณอย่างไร
FF คือตัวเลขที่เขียนในโหมด hex ตัวเลขนั้นแสดงถึง 255 ในรูปทศนิยม ตัวอย่างเช่นหากคุณต้องการ 42% ในการคำนวณคุณจำเป็นต้องค้นหา 42% ของผู้ที่มีตำแหน่ง 255 และแปลงจำนวนนั้นเป็นฐานสิบหก 255 * 0.42 ~ = 107 107 ถึง hex คือ "6B - maleta
การเพิ่มคำตอบอื่น ๆ และทำอะไรมากกว่าสิ่งที่ @Maleta อธิบายในความคิดเห็นในhttps://stackoverflow.com/a/28481374/1626594ทำอัลฟา * 255 แล้วรอบแล้วฐานสิบหก นี่คือตัวแปลงด่วนhttp://jsfiddle.net/8ajxdLap/4/
function rgb2hex(rgb) {
var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?((?:[0-9]*[.])?[0-9]+)[\s+]?\)/i);
if (rgbm && rgbm.length === 5) {
return "#" +
('0' + Math.round(parseFloat(rgbm[4], 10) * 255).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
} else {
var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
if (rgbm && rgbm.length === 4) {
return "#" +
("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
} else {
return "cant parse that";
}
}
}
$('button').click(function() {
var hex = rgb2hex($('#in_tb').val());
$('#in_tb_result').html(hex);
});
body {
padding: 20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Convert RGB/RGBA to hex #RRGGBB/#AARRGGBB:<br>
<br>
<input id="in_tb" type="text" value="rgba(200, 90, 34, 0.75)"> <button>Convert</button><br>
<br> Result: <span id="in_tb_result"></span>
เพียงใช้สิ่งนี้:
หุ่นยนต์: พื้นหลัง = "# 00FFFFFF"
มันจะทำงานของคุณ
หากคุณมีค่าฐานสิบหกของคุณและคุณเพียงแค่สงสัยว่าค่าของอัลฟาจะเป็นเช่นไรตัวอย่างนี้อาจช่วย:
const alphaToHex = (alpha => {
if (alpha > 1 || alpha < 0 || isNaN(alpha)) {
throw new Error('The argument must be a number between 0 and 1');
}
return Math.ceil(255 * alpha).toString(16).toUpperCase();
})
console.log(alphaToHex(0.45));