2019-05-10
- added css processing from <style> and <link rel="stylesheet">
<link> will block rendering of the page until all files are downloaded
css files are cached locally same as images- element tag, id, class, attr selectors
- combinators (p+p, p~p, ul>li, ul li)
- :only-child, :first-child, :last-child, :nth-child(An+B) pseudo classes
- ::before, ::after pseudo elements. attaching these on block level element (ie table) may not work as intended.
- <button> can be used outside <form> element for submit action.
<button form="formid" name="submit" value="submit value">text goes here</button>
<button form="formid" name="submit" value="submit value"><img src=".."></button>
Avoid changing text style inside button as it does not render correctly (splits button into multiple parts)
<button form="formid" name="submit" value="submit value">text <span>goes</span> here</button>. - <meter> - webkit prefix pseudo elements can be used to change the background-color
:-webkit-meter-bar, :-webkit-meter-optimum-value, :-webkit-meter-suboptimum-value, :-webkit-meter-even-less-good-value,
<style>meter::-webkit-meter-optimum-value { background-color: blue; }</style> - <progress> - webkit prefixed pseudo elements can be used to change the background-color
<style>
progress::-webkit-progress-bar { background-color: red; }
progress::-webkit-progress-value { background-color: yellow; }
</style> - "font:inherit" to inherit all font attributes from parent element
<style> input, textarea { font: inherit; }</style> - pt, em, rem size units. These can be used in font-size, width/height values.
1pt = 0.75px, rem uses font-size from <html> element. - a.ryzom-ui-button, input, textarea width/height can be changed using css
<style>textarea { width: 20em; height: 5em; }</style> - background-color for buttons/links/textarea
<style>input[type=submit], a.ryzom-ui-button { background-color: blue; }</style> - -ryzom-background-color-over css property for mouse over effect for buttons/links
<style>
input[type=submit], a.ryzom-ui-button { -ryzom-background-color-over: yellow; }
input[value="Delete"] { -ryzom-background-color-over: red; }
</style> - css background shorthand parsing for those elements that make use of it
---
Hello!