How to view css behind default html tags? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 16

How to view css behind default html tags?

like <select> <input>

20th Nov 2018, 4:15 AM
Ratnapal Shende
Ratnapal Shende - avatar
13 Answers
+ 3
I think I understand your question now. You are asking about the css styles that are responsible for the way default html tags look? Well, i think html was created way before css was and html tags were able to be styled without the use of css. Therefore I do not think css is at all responsible for the way default html tags look like. I think they are just in built. I think you have to go into the browser source code to be able to view what you are asking or maybe some browsers could be having features which can enable you to do so. can someone else elaborate more on this please?
21st Nov 2018, 1:01 PM
Dzeff
Dzeff - avatar
+ 12
if I want to create custom radio button then I need to write css in it if i use inbuild tag name <input type="radio"> then I no need to add css then what is the css behind that tag?
20th Nov 2018, 12:09 PM
Ratnapal Shende
Ratnapal Shende - avatar
+ 5
/* On mouse-over, add a grey background color */ .container:hover input ~ .checkmark { background-color: #ccc; } /* When the radio button is checked, add a blue background */ .container input:checked ~ .checkmark { background-color: #2196F3; } https://www.w3schools.com/howto/howto_css_custom_checkbox.asp
20th Nov 2018, 4:30 PM
Gordon
Gordon - avatar
+ 4
Good question
21st Nov 2018, 8:50 PM
ramzieus ⚡
ramzieus ⚡ - avatar
+ 3
use id or class e.g <input type = "radio" id = "radioBtn"> ...then css.... #radioBtn{ margin-left: 5px; }
21st Nov 2018, 5:38 AM
Dzeff
Dzeff - avatar
+ 3
From CSS Fundamentals on SoloLearn: " Cascade The final appearance of a web page is a result of different styling rules. The three main sources of style information that form a cascade are: - The stylesheet created by the author of the page - The browser's default styles - Styles specified by the user "
21st Nov 2018, 8:03 AM
Tom BWDEV 🇺🇦
Tom BWDEV 🇺🇦 - avatar
+ 3
You could use the getComputedStyle() method (from 'window' global object, so available in global scope) wich return runtime browser full supported css properties keys/values, through a CCSStyleDeclaration object of any document element (provided as parameter)... but if your purpose is to design form input elements, you need to know that they don't have only real classic css behind them to be rendered in browsers, as they are handled by OS through the browser ^^ So it's less or more tricky to customize their appearence (some less, some more) and get them look same across different browsers/platforms... https://code.sololearn.com/WHt0Swgy3Ul6/?ref=app https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle https://www.hongkiat.com/blog/css3-checkbox-radio/
21st Nov 2018, 12:35 PM
visph
visph - avatar
+ 2
Each browser has built in CSS, which can sometimes make cross browser CSS functionality difficult. For this reason a lot of developers use something like CSS Normalize (https://necolas.github.io/normalize.css/). Other developers may use their own "reset" css file that is something like what is described here: https://meyerweb.com/eric/tools/css/reset/ This may not technically answer your question in the way you asked it, but these are common practices found in the industry for handling default css in various browsers.
21st Nov 2018, 3:27 PM
Logan
Logan - avatar
+ 1
can you explain a bit more of what you need?
20th Nov 2018, 5:04 AM
Jason Kennedy
+ 1
+ You can see HTML elements' style info using Chrome Development Tools.
21st Nov 2018, 8:09 AM
Tom BWDEV 🇺🇦
Tom BWDEV 🇺🇦 - avatar
+ 1
s
22nd Nov 2018, 3:35 AM
yusuph kaondo
yusuph kaondo - avatar
0
Я русский
21st Nov 2018, 1:23 PM
Всеволод Давыдов
Всеволод Давыдов - avatar
0
Use notepad++ dude
23rd Nov 2018, 12:46 PM
El-Mustapha Janga
El-Mustapha Janga - avatar