Главная » Языки программирования

Social media sharing buttons html

Содержание
  1. How TO — Social Media Buttons
  2. Rounded Example
  3. COLOR PICKER
  4. Report Error
  5. Thank You For Helping Us!
  6. 18 CSS Social Share Buttons
  7. Related Articles
  8. Author
  9. Links
  10. Made with
  11. About a code
  12. Share Button Hover Effect
  13. Author
  14. Links
  15. Made with
  16. About a code
  17. Share Button Hidden Icon
  18. Author
  19. Links
  20. Made with
  21. About a code
  22. Share Profile Button
  23. Author
  24. Links
  25. Made with
  26. About a code
  27. Neumorphism Social Share Button
  28. Author
  29. Links
  30. Made with
  31. About a code
  32. Share Button Float Icon
  33. Author
  34. Links
  35. Made with
  36. About the code
  37. Hover Me Pill Button
  38. Author
  39. Links
  40. Made with
  41. About the code
  42. Share Buttons Animation
  43. Author
  44. Links
  45. Made with
  46. About the code
  47. Share Button
  48. Author
  49. Links
  50. Made with
  51. About the code
  52. Social Share Button UI
  53. Author
  54. Links
  55. Made with
  56. About the code
  57. Facebook/Instagram Share Button
  58. Author
  59. Links
  60. Made with
  61. About the code
  62. Social Share Button
  63. Author
  64. Links
  65. Made with
  66. About the code
  67. Share Button
  68. Author
  69. Links
  70. Made with
  71. About the code
  72. Social Media Icons Share
  73. Author
  74. Links
  75. Made with
  76. About the code
  77. CSS Share Icons
  78. Author
  79. Links
  80. Made with
  81. About the code
  82. Social Share Button
  83. Author
  84. Links
  85. Made with
  86. About the code
  87. Social Share Button
  88. Author
  89. Links
  90. Made with
  91. About the code
  92. Slide-Out Social Buttons
  93. Author

How TO — Social Media Buttons

Tip: Add border-radius:50% to create round buttons, and reduce the width :

Rounded Example

.fa <
padding: 20px;
font-size: 30px;
width: 30px;
text-align: center;
text-decoration: none;
border-radius: 50%;
>

Tip: Go to our Icons Tutorial to learn more about icons.

Go to our CSS Buttons Tutorial to learn more about how to style buttons.

Читайте также:  Is used prior to global declaration python

Unlock Full Access 50% off

COLOR PICKER

colorpicker

Join our Bootcamp!

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials
Top References
Top Examples
Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

18 CSS Social Share Buttons

Collection of hand-picked free HTML and CSS social share button code examples from Codepen, GitHub and other resources. Update of October 2021 collection. 3 new items.

Author

Made with

About a code

Share Button Hover Effect

Compatible browsers: Chrome, Edge, Opera, Safari

Author

Made with

About a code

Share Button Hidden Icon

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Share Profile Button

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Neumorphism Social Share Button

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Share Button Float Icon

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

Hover Me Pill Button

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Share Buttons Animation

Author

Made with

About the code

Share Buttons Animation

HTML and CSS share buttons animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Share Button

Author

Made with

About the code

Share Button

Inspired by Chris Gilmore’s shot on dribbble.com.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Social Share Button UI

Author

Made with

About the code

Social Share Button UI

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Facebook/Instagram Share Button

Author

Made with

About the code

Facebook/Instagram Share Button

Pretty and simple share buttons for Instagram and Facebook.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Social Share Button

Author

Made with

About the code

Social Share Button

Cool animation, like the idea behind it — literally.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Share Button

Author

Made with

About the code

Share Button

Simple and unique share button in HTML and CSS. Version with jQuery: https://codepen.io/onediv/pen/dkFco.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Social Media Icons Share

Author

Made with

About the code

Social Media Icons Share

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: CSS Share Icons

Author

Made with

About the code

CSS Share Icons

Pure CSS share icons with hover effects.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Social Share Button

Author

Made with

About the code

Social Share Button

Social share button that pull apart into seperate buttons.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Social Share Button

Author

Made with

About the code

Social Share Button

Pure CSS social share button.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Slide-Out Social Buttons

Author

Made with

About the code

Slide-Out Social Buttons

Experiment with hover states and social buttons.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Demo image: Simple Share Button

Author

Источник

Оцените статью
© 2024 Программирование