[Learning]#5 Types of CSS Selector

body{
font-size:16;font-family:"Arial"
}
h3{
font-size:24;text-decoration:underline;
}
  • Add a “dot” before the class. Also, we can connect a specific tag before the class if we want it to be the exclusive use of the tag.
div.content{
padding:10px;border:1px dashed #888888;
}
  • Add a “#” before the id
#btn{
border:1px solid #888888;
background-color:#ffffff;padding:5px;
}
  • Often used with other selectors
  • Example1. #:hover — for button clicking design
#btn:hover{
background-color:#888888;
}
  • Example2. #:focus — for getting cursor’s focus
input:focus{
border:2px solid #ff0000;
}
  • Often used with other selectors
.content1 a{
color:#0000ff;
}
.content2 a{
color:#008800;
}

Music of Today: Peaches covered by 吱吱郭芝吟ChihChih

Clap/Share/Follow

--

--

--

PM, Relationship, Travel, or anything quirky but interesting.|Subscribe & buy Vida a drink @LikerLand, the bottom of each article. 在文章底下LikerLand訂閱、請Vida喝一杯飲料 ❤

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Project Ideas for Data Structures

Data Structures C++ Course — Tutort

Anti-Patterns in Agile Product Development — Part V

How to convert WEBP to PNG in Javascript

Pascal’s Triangle: how I love how thee let me count the ways

PL/SQL Varrays

This is why we love flutter!

On Building a Unified Test Automation Framework

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Vida Lin

Vida Lin

PM, Relationship, Travel, or anything quirky but interesting.|Subscribe & buy Vida a drink @LikerLand, the bottom of each article. 在文章底下LikerLand訂閱、請Vida喝一杯飲料 ❤

More from Medium

Flexbox vs Grid: when and where to use.

Getting Started With CSS Flex-Box(How To Create Boxes with Equal widths In a Container)

Introduction To CSS

Color Extraction Tools for Front End Web Development