مرحبا عزيزي قارئ المدونة! لدي اليوم عدد قليل من رموز CSS التي تسمح لك بجعل مدونتك مذهلة. أنت تدرك أن العناوين هي الجزء الأكثر أهمية في محتوى المدونة، فلماذا تجعلها مملة؟ تأكد من نسخ رموز CSS الموجودة أسفلها ولصقها في قسم محرر الإرسال الخاص بك.
المثال الاول 1
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background: #0194ff;
color: #fff;
padding: 10px;
line-height: 1.7em;
box-shadow: 0 2px 10px 0 #cac9c9;
text-align: center;
user-select: none;
cursor: pointer;">Your Heading is Here</h2>
المثال الثاني 2
معاينة
Your Heading is Here
<h2 style="background: rgb(101, 66, 237);
border-left: 20px solid rgb(0, 0, 0);
box-shadow: rgb(202, 201, 201) 0px 2px 10px 0px;
color: white; cursor: pointer;
font-size: 18px;
font-weight: 600;
line-height: 1.7em;
padding: 10px;
text-align: center;
user-select: none;">Your Heading is Here</h2>
المثال الثالث 3
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background-image: linear-gradient(to right, #ff5f00, #ff782f, #ff8d4e, #fea26d, #fbb58c);
color: #fff;
padding: 10px;
line-height: 1.7em;
box-shadow: 0 2px 10px 0 #cac9c9;
text-align: left;
user-select: none;
cursor: pointer;
border-left: 20px solid red;">Your Heading is Here</h2>
المثال الرابع 4
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background: #fff;
color: #000;
padding: 10px;
line-height: 1.7em;
box-shadow: 0 2px 10px 0 #cac9c9;
text-align: center;
user-select: none;
cursor: pointer;
border-left: 20px solid #ff5f00;
border-right: 20px solid #ff5f00;
border-radius: 5px 55px 5px 55px;">Your Heading is Here</h2>
المثال الخامس 5
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background: #fff;
color: #000;
padding: 10px;
line-height: 1.7em;
box-shadow: 0 2px 10px 0 #cac9c9;
text-align: center;
user-select: none;
cursor: pointer;
border-left: 20px solid #ff0077;
border-right: 20px solid #ff0077;
border-radius: 55px;">Your Heading is Here</h2>
المثال السادس 6
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background: #a4aafc;
color: #fff;
padding: 10px;
line-height: 1.7em;
box-shadow: 0 2px 10px 0 #cac9c9;
text-align: center;
user-select: none;
cursor: pointer;
border-left: 30px solid #000ba3;
border-right: 30px solid #000ba3;">Your Heading is Here</h2>
المثال السابع 7
معاينة
Your Heading is Here
<h2 style="font-weight: 600;
font-size: 18px;
background:#333;
margin:5px 4px 5px 0;
padding:9px 0 9px 10px;
border:0;
color:white;
line-height:1.7em;
text-decoration:none;
text-transform:uppercase;
box-shadow:4px 4px 0px rgba(33,33,33,0.45);">Your Heading is Here</h2>
أتمنى أن تعجبك رموز CSS هذه. لأعظم مثل هذا. إذا كنت تريد المزيد من عناوين CSS، فاسأل حقًا في حاوية التعليقات، وسأعود مرة أخرى مع عناوين CSS جديدة وعصرية أكبر. شكرًا!
