html - Create a "inset" effect using CSS in websites -


I'm quite impressed by the "inset" effect in many recent websites, some examples are

and

Line in the center. Nowadays, many websites use these types of lines / effects.

I tried to get it with the boundaries but the color combination is not working at all and it is not fair.

Do other websites use images for these? Is it easy?

Example CSS:

Post-text "itemprop =" text ">

this Do not know what this will help, but using 1 Px borders which can be made from a little light and dark with the background of the 2 adjacent elements. For example:

   gt; Top & gt; & lt; title & gt; Untitled & lt; / title & gt; & lt; Style Type =" Text / CSS "& Gt; Div {ba Ckground: # 555;} .top {border-bottom: # 333 solid 1px;} .bot {border-top: # 777 solid 1px;}  gt; & lt; / head & gt; & lt ; Body & gt; & lt; div class = "top"> this  gt; div class = "bot" & gt; atithis & lt; / div & gt; & lt; / Body>  

Edit:

As a side note, in the above example light and dark By changing you will get a slightly raised / embossed border effect.


Comments

Popular posts from this blog

windows - Heroku throws SQLITE3 Read only exception -

lex - Building a lexical Analyzer in Java -

python - rename keys in a dictionary -