惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

S
SegmentFault 最新的问题
Spread Privacy
Spread Privacy
Google DeepMind News
Google DeepMind News
WordPress大学
WordPress大学
Blog — PlanetScale
Blog — PlanetScale
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Apple Machine Learning Research
Apple Machine Learning Research
SecWiki News
SecWiki News
腾讯CDC
P
Privacy International News Feed
Webroot Blog
Webroot Blog
J
Java Code Geeks
爱范儿
爱范儿
A
About on SuperTechFans
S
Secure Thoughts
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
D
DataBreaches.Net
Cloudbric
Cloudbric
Security Archives - TechRepublic
Security Archives - TechRepublic
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
C
Cyber Attacks, Cyber Crime and Cyber Security
P
Proofpoint News Feed
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Security Latest
Security Latest
Forbes - Security
Forbes - Security
小众软件
小众软件
www.infosecurity-magazine.com
www.infosecurity-magazine.com
C
Cybersecurity and Infrastructure Security Agency CISA
T
Threatpost
量子位
MongoDB | Blog
MongoDB | Blog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
月光博客
月光博客
W
WeLiveSecurity
P
Privacy & Cybersecurity Law Blog
Vercel News
Vercel News
Google Online Security Blog
Google Online Security Blog
云风的 BLOG
云风的 BLOG
GbyAI
GbyAI
S
Security @ Cisco Blogs
T
The Exploit Database - CXSecurity.com
Help Net Security
Help Net Security
V
Visual Studio Blog
C
CXSECURITY Database RSS Feed - CXSecurity.com
Application and Cybersecurity Blog
Application and Cybersecurity Blog
博客园 - 聂微东
P
Proofpoint News Feed
C
CERT Recently Published Vulnerability Notes
Attack and Defense Labs
Attack and Defense Labs

peijie's wiki

怎么抢高铁票 - peijie's wiki 两日游背包收纳 - peijie's wiki 什么是 AI,什么是大语言模型,缺点分析,以及使用技法和技巧总结 - peijie's wiki macOS 里关于“名字”的那些事 - peijie's wiki 将 CapsLock 映射为 Escape,对于macos - peijie's wiki 拔智齿后的食谱 - peijie's wiki 拔智齿后的食谱 - peijie's wiki proxy搭建稳如老狗的原理(老白版) - peijie's wiki 混音原理,Linux混音实操,有线麦克风录音+混录系统BGM+耳返监听 - peijie's wiki Linux 搜索最佳实践【入门版】 - peijie's wiki 线材库存 - peijie's wiki 药品库存 - peijie's wiki pacman - peijie's wiki chinese-input-method-setup - peijie's wiki Programming Concepts and Algorithms/Solutions - peijie's wiki Programming Foundations with HTML - peijie's wiki 如何高效地学习一门编程语言 - peijie's wiki 低卡火锅蘸料 - peijie's wiki 使用键盘组合键启动iTerm - peijie's wiki 中餐厨艺课 - peijie's wiki liupj.top
Programming Foundations with CSS - peijie's wiki
lpj · 2025-03-30 · via peijie's wiki
  1. Web pages are often designed to accommodate [different device/different screen] so that to decide how to display and even what to dispaly.

  2. Users experience webpages differently, some users are color-blind, some can’t see well, some have trouble hearing, some can’t clicking, etc…

So to ensure GoodUserExperience:

web-designers must take [devices & users] into account when creating webpages.

and webpages should load quickly.


CSS: Cascading Style Sheets

[HTML specifies the content | CSS specifies the look & formating] of webpages.

This allows web-designers to separate the content from how it’s presented, which can accommodate different users and different display devices to make sure that even in other countries, these can be displayed without changing the content of the webpage.

And if you’re creating thousands of webpages for a website, changing the color or font or the size of an HTML element can be localized in one place, rather than repeated in a thousand places which would make changes difficult. This is called [Maintainability] in response to changing design requirments & [Reusability] across multiple elements or even multiple webpages.

CSS Basics

1
You could include CSS by either using <style> or <link> tag which are go in the <head> portion of you HTML.

  • Selector
    • tag_name
    • class
    • id
    • combinators: select by relationship(eg: style <li> inside of <ul>: ul li { ... })

Note: You should make name descriptive.(eg: foodLi => can means food-list-items)


https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

Q&A:

  1. whats-the-difference-between-an-id-and-a-class

  2. what-error-will-i-get-if-i-use-the-same-id-for-multiple-html-elements

Colors

https://www.w3.org/TR/2022/REC-css-color-3-20220118/

140 standard color names.

An important concept: Everything is a number for a computer.

Red + Green + Blue, 0-255, => can specify about 16 million colors. => more than humans can distinguish.

eg: Gold == rgb(255, 215, 0)

because of that 0-255 is 256 possible colors, which can be presented by 两个十六进制的数字

FF == 15 * 16 + 15 == 255

D7 == 13 * 16 + 7 == 215

00 == 0 * 16 + 0 == 0

so, Gold == #FFD700

https://developer.mozilla.org/en-US/docs/Web/CSS/Tools/ColorPicker_Tool