- Embed/insert HTML content?
Re: Embed/insert HTML content?
toggle quoted messageShow quoted text
On Jul 15, 2020, at 5:08 AM, ThatKeith via groups.io <Thatkeithemail@example.com> wrote:
And to explain this further the values are:
Horizontal offset, vertical offset, blur radius, spread radius, shadow colour.
• The horizontal value controls the left/right position of the shadow, and is required. Negative values shift the shadow to the left.
• The vertical value controls the up/down position of the shadow, and is required. Negative values shift the shadow upwards.
• Blur radius isn't a required value. If you don't supply one the 'shadow' will be as sharp as a scalpel cutout, as if you'd given a value of zero.
• Spread radius isn't required but if used does require a blur radius value (even just zero) so that it's clear this is the fourth item. This affects the scale of the shadow; negative values shrink it down from the default size, positive values grow the shadow.
• Shadow colour is only required if you want something other than a neutral black for the shadow. You can use any valid method of specifying colour, including rgba( ) which provides control of the overall opacity of the shadow colour (separately from the translucency of the blur).
Although these are visually separated with commas here for ease of reading the values should be separated only by a space, not a comma. The only times you'd use commas are within rgb or rgba colour specifications and if you're stacking up multiple shadows in one box-shadow extended property. This is a really cool capability if you'd like to try for something a little more photorealistic, or at least a little less corny. Each complete SET of values must be separated by a comma. The example below strings two shadow values together to create a large hazy pale shadow (using rgba to set half-strength/0.5 opacity) and a denser one (although grey rather than default black shadow colour) more immediately 'behind' the object:
0px 10px 10px -5px rgba(0,0,0,0.5), 0px 25px 30px gray
Put that straight into the 'value' part of an object's Extended Properties 'box-shadow' name and preview in a browser to see how it looks. Have fun!
Join firstname.lastname@example.org to automatically receive all group messages.