Jadual Kandungan
数字
颜色——命名颜色
aqua
fuchsia
lime
olive
red
white
black
gray
maroon
orange
silver
yellow
blue
green
navy
pruple
teal
颜色——RGB颜色
 
颜色——16进制RGB颜色
颜色——等忦颜色表
 颜色——Web安全色
长度单位
长度单位——相对长度单位
 
Rumah hujung hadapan web html tutorial Web前端新人笔记之CSS值和单位_html/css_WEB-ITnose

Web前端新人笔记之CSS值和单位_html/css_WEB-ITnose

Jun 24, 2016 am 11:20 AM

数字

颜色——命名颜色

在Css2.1中规范定义了17个颜色名。包括html4.0中定义的16个颜色及外加一个橙色;
Salin selepas log masuk

<h1 id="aqua">aqua</h1><h1 id="fuchsia">fuchsia</h1><h1 id="lime">lime</h1><h1 id="olive">olive</h1><h1 id="red">red</h1><h1 id="white">white</h1><h1 id="black">black</h1><h1 id="gray">gray</h1><h1 id="maroon">maroon</h1><h1 id="orange">orange</h1><h1 id="silver">silver</h1><h1 id="yellow">yellow</h1><h1 id="blue">blue</h1><h1 id="green">green</h1><h1 id="navy">navy</h1><h1 id="pruple">pruple</h1><h1 id="teal">teal</h1>
Salin selepas log masuk

当然网页上不只有这些颜色组成。Web浏览器能识别多达140多个颜色名。包括上面我们提到的。具体就不介绍了;
Salin selepas log masuk

颜色——RGB颜色

计算机通过组合不同的红色、绿色、蓝色创建新的颜色,这种组合成为RGB颜色;
Salin selepas log masuk

使用百分数记法指定白色和黑色: rgb(100%,100%,100%); rgb(0%,0%,0%);使用整数三元组记法: rgb(255,255,255); rgb(0,0,0);
Salin selepas log masuk

如果当用户输入的值为小数且值是在可取范围之内的。都会以"四舍五入"的方式精确到最接近范围的边界。如果一个值大于100%或者小于0%。都会被默认的调整回到100%或者0%;
Salin selepas log masuk

p spanOne{color:rgb(300%,1230%,110%);}/*100%,100%,100%*/p spanTwo{color:rgb(0%,-780%,-34535%);}/*0%,0%,0%*/p spanThree{color:rgb(13,35,656);}/*13,35,255*/
Salin selepas log masuk

颜色——16进制RGB颜色

工作原理:将三个介于00~FF的16进制数连起来。就能设置一种颜色。记法的一般语法是#AABBCC。且三个数之间没有空格、逗号及其他分隔符。
Salin selepas log masuk

h1{color:rgb(255,255,255) ;} 等价于 h1{color:#FFFFFF ;}而h1{colol:reb(51,102,58);}    等价于 h1{color:#336680}
Salin selepas log masuk

颜色——等忦颜色表

颜色——Web安全色

0%或者0是一个安全值。如果使用RGB百分数,要让所有的3个值都要么是0%或者是一个能被20整除的数eg: rgb(40%,100%,80%);如果使用0~255范围的RGB值那么所有的3个值都要么是0或者是一个能被51整除的数eg: rgb(0,204,153);
Salin selepas log masuk

长度单位

英寸(in)、厘米(cm) 、毫米(mm)、点(pt)、派卡(pica);
Salin selepas log masuk

长度单位——相对长度单位

相对长度单位共有3种:em、ex和px
Salin selepas log masuk
 
Salin selepas log masuk
ps:<br />本章内容只是自己根据阅读CSS权威指南做出的一点小知识积累。可能不太详细,如若有大神阅读本文章尽量对我的文章做出点评。让我知道还有哪些不足之处加以改正
Salin selepas log masuk

 

 

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Apakah tujuan & lt; kemajuan & gt; unsur? Apakah tujuan & lt; kemajuan & gt; unsur? Mar 21, 2025 pm 12:34 PM

Artikel ini membincangkan html & lt; kemajuan & gt; elemen, tujuan, gaya, dan perbezaan dari & lt; meter & gt; elemen. Tumpuan utama adalah menggunakan & lt; kemajuan & gt; untuk menyelesaikan tugas dan & lt; meter & gt; untuk stati

Apakah tujuan & lt; DATALIST & GT; unsur? Apakah tujuan & lt; DATALIST & GT; unsur? Mar 21, 2025 pm 12:33 PM

Artikel ini membincangkan html & lt; datalist & gt; elemen, yang meningkatkan bentuk dengan menyediakan cadangan autokomplete, meningkatkan pengalaman pengguna dan mengurangkan kesilapan. Kira -kira: 159

Apakah amalan terbaik untuk keserasian penyemak imbas dalam HTML5? Apakah amalan terbaik untuk keserasian penyemak imbas dalam HTML5? Mar 17, 2025 pm 12:20 PM

Artikel membincangkan amalan terbaik untuk memastikan keserasian silang pelayar HTML5, memberi tumpuan kepada pengesanan ciri, peningkatan progresif, dan kaedah ujian.

Apakah tujuan & lt; meter & gt; unsur? Apakah tujuan & lt; meter & gt; unsur? Mar 21, 2025 pm 12:35 PM

Artikel ini membincangkan html & lt; meter & gt; elemen, digunakan untuk memaparkan nilai skalar atau pecahan dalam julat, dan aplikasi umum dalam pembangunan web. Ia membezakan & lt; meter & gt; dari & lt; kemajuan & gt; dan Ex

Bagaimana saya menggunakan html5 & lt; masa & gt; elemen untuk mewakili tarikh dan masa secara semantik? Bagaimana saya menggunakan html5 & lt; masa & gt; elemen untuk mewakili tarikh dan masa secara semantik? Mar 12, 2025 pm 04:05 PM

Artikel ini menerangkan html5 & lt; time & gt; elemen untuk perwakilan tarikh/masa semantik. Ia menekankan pentingnya atribut DateTime untuk pembacaan mesin (format ISO 8601) bersama teks yang boleh dibaca manusia, meningkatkan aksesibilit

Bagaimana saya menggunakan atribut pengesahan borang html5 untuk mengesahkan input pengguna? Bagaimana saya menggunakan atribut pengesahan borang html5 untuk mengesahkan input pengguna? Mar 17, 2025 pm 12:27 PM

Artikel ini membincangkan menggunakan atribut pengesahan bentuk HTML5 seperti had, corak, min, max, dan panjang untuk mengesahkan input pengguna secara langsung dalam penyemak imbas.

Apakah tag meta viewport? Mengapa penting untuk reka bentuk responsif? Apakah tag meta viewport? Mengapa penting untuk reka bentuk responsif? Mar 20, 2025 pm 05:56 PM

Artikel ini membincangkan tag Meta Viewport, penting untuk reka bentuk web responsif pada peranti mudah alih. Ia menerangkan bagaimana penggunaan yang betul memastikan skala kandungan yang optimum dan interaksi pengguna, sementara penyalahgunaan boleh membawa kepada isu reka bentuk dan kebolehaksesan.

Apakah tujuan & lt; iframe & gt; Tag? Apakah pertimbangan keselamatan semasa menggunakannya? Apakah tujuan & lt; iframe & gt; Tag? Apakah pertimbangan keselamatan semasa menggunakannya? Mar 20, 2025 pm 06:05 PM

Artikel ini membincangkan & lt; iframe & gt; Tujuan TAG dalam membenamkan kandungan luaran ke dalam halaman web, kegunaan umum, risiko keselamatan, dan alternatif seperti tag objek dan API.

See all articles