السلام عليكم ورحمه الله وبركاته
اليوم معنا موضوع مميز عن اداه مشاركة مميزة
الان انا اضع بين ايضيكم اشكال احتارفيه لى اداه مشاركة مميزة
اكدم لكم 5 اشكال احترافيه
لماذا تستخدم هذه الاشكال مع مميزة المشاركة ؟
الشكل الافتراضى لأداة شكل سئ جدأ لهذا السبب قررت اضع لكم اشكال احترافيه للاداه لى جعل القالب لهو شكل احترافى ومتواضع ويجزب للذائر
قبل استخدام اى شيء عليك اولأ البحث عن الكود
<link href='https://fonts.googleapis.com/css?family=Oswald|Lobster:400' rel='stylesheet' type='text/css'/>
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>كيف استخدم الاشكال التاليه لاداة مشاركة موضوع مميز
اذهب للمدونه الخاصه بك -->قالب-->تحرير HTML.اضغط على Ctrl + F
وابحث عن ]]>
مشاركة مميزه 1
/********************************************
Featured Post
********************************************/
.post-summary { background: #132df2; color: #FFF; padding: 20px; box-shadow: 2px 4px 2px 2px #E4E4E4; margin-top: 19px; padding-top: 10px; } .post-summary a { color: #FFF; font-family: Oswald; font-weight: 100; text-decoration: none; } .post-summary:hover:before { opacity: 1; } .post-summary:before { content: "متميز"; background: #000; opacity: .7; font-family: Lobster; padding: 10px; position: relative; float: right; top: -10px; right: -20px; transition: .3s; } .post-summary .image { box-shadow: 2px 2px 4px 0px #0088C1; border: 2px solid #0088C1; }مشاركة مميزه 2
/********************************************
Featured Post
********************************************/
.post-summary:before { content: "\f123 متميز"; background: #000; opacity: 1; font-family: Lobster, FontAwesome; padding: 10px; transition: .3s; position: relative; float: right; color: #FFB300; top: -10px; right: -20px; } .post-summary { background: #eabd19; color: #fff; padding: 20px; box-shadow: 2px 2px 7px -1px #777777; margin-top: 19px; padding-top: 10px; border-radius: 10%; border-bottom-left-radius: 0%; border-top-right-radius: 0%; } .post-summary a { color: #000; font-family: Oswald; font-weight: 100; text-shadow: 0px 0px 1px #000; text-decoration: none; } .post-summary p { color: #4A4A4A; font-family: sans-serif; font-size: 14px; line-height: 20px;} .post-summary .image { box-shadow: 2px 2px 4px 0px #000000; border: 2px solid #E6A200; } .post-summary:hover p { color: #000; }مشاركة مميزه 3
/********************************************
Featured Post
********************************************/
.post-summary { background: #1F1F1F; color: #FFF; padding: 20px; box-shadow: 2px 4px 2px 2px #E4E4E4; margin-top: 19px; padding-top: 10px; border-radius: 10%; border-bottom-left-radius: 0%; border-top-right-radius: 0%; } .post-summary:before { content: "\f123 متميز"; background: #000; opacity: .7; font-family: Oswald, FontAwesome; padding: 10px; position: relative; float: right; color: #FFB300; top: -10px; right: -20px; text-transform: uppercase; } .post-summary a { color: #FFF; font-family: Oswald; font-weight: 100; text-shadow: 2px 2px 2px #000; text-decoration: none; } .post-summary .image { box-shadow: 2px 2px 4px 0px #000000; border: 2px solid #E6A200; } .post-summary:hover:before { opacity: 1; }مشاركة مميزه 4
/********************************************
Featured Post
********************************************/
.post-summary:before { content: "\f123 متميز"; background: #000; opacity: 1; font-family: Lobster, FontAwesome; padding: 10px; transition: .3s; position: relative; float: right; color: #FFB300; top: -10px; right: -20px; } .post-summary { background: #FF0000; color: #000000; padding: 20px; box-shadow: 2px 2px 7px -1px #777777; margin-top: 19px; padding-top: 10px; border-radius: 10%; border-bottom-left-radius: 0%; border-top-right-radius: 0%; } .post-summary a { color: #000; font-family: Oswald; font-weight: 100; text-shadow: 0px 0px 1px #000; text-decoration: none; } .post-summary p { color: #4A4A4A; font-family: sans-serif; font-size: 14px; line-height: 20px; } .post-summary .image { box-shadow: 2px 2px 4px 0px #000000; border: 2px solid #E6A200; } .post-summary:hover p { color: #000; }مشاركة مميزه 5
/********************************************
Featured Post
********************************************/
.post-summary { background: #19eac0; color: #fff; padding: 20px; box-shadow: 2px 4px 2px 2px #EF4C4C; margin-top: 19px; padding-top: 20px; font-size: 18px; } .post-summary:before { content: "متميز"; background: #32ea19; font-family: Lobster; width: 93%; padding: 10px; position: relative; overflow: hidden; float: right; z-index: 10; top: -20px; right: -20px; box-shadow: 2px 2px 2px 2px #EF4C4C; transition: .3s; } .post-summary:after { content: "\f123"; position: relative;
font-family: FontAwesome; box-shadow: 2px 2px 2px 2px #EF4C4C; background: #EF4C4C; top: -482px; left: -20px; padding-left: 14px!important; padding: 11px; padding-right: 14px!important; } .post-summary a { color: #444444; font-size: 26px; font-family: Oswald; font-weight: 100; text-decoration: none; } .post-summary .image { box-shadow: 4px 4px 4px 0px #EF4C4C; border: 4px solid #444444; }الخلاصه
اتمنى ان يكون الموضوع نال اعجابكم ورجاءا لا تبخلوا ع بتعليقتكم المشجعه