1 Like
Well done 
مية مية
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>الصفحة الرئيسية</title>
<link href="https://fonts.googleapis.com/css?family=Amiri|Lilita+One|PT+Serif&display=swap" rel="stylesheet">
<style>
body{
background-color:aquamarine ;
}
p{
width: 400px;
background-color: #FF8C00;
color:aliceblue ;
font-family: 'Amiri', serif;
font-family: 'PT Serif', serif;
font-family: 'Lilita One', cursive;
font-size: 25px;
text-align: center;
line-height:40px ;
}
div p{
background-color: #C71585;
}
</style>
</head>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunshine
</p>
<div>
<p>
If you work just for money, you'll never make it, but if you
love what you're doing success will be yours
</p>
</div>
</body>
</html>
1 Like
ممتاز وللملاحظة قمت بتكرار الخاصية font-family ثلاث مرات متتالية ما يعني بأن كل خاصية ستطغى على التي قبلها وسيتم تطبيق الخاصية الأخيرة الي هي بالقيمة 'Lilita One', cursive
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>مهمة التدرب على لغة التنسيقات</title>
<link href="https://fonts.googleapis.com/css?family=Cairo|Gelasio|Indie+Flower|Noto+Serif&display=swap" rel="stylesheet">
</head>
<style>
body {
background-color: #333;
}
p {
width: 400px;
color: #f4f4f4;
padding: 10px;
line-height: 30px;
font-size: 25px;
font-weight: bold;
font-family: 'Cairo', sans-serif;
font-family: 'Gelasio', serif;
font-family: 'Noto Serif', serif;
font-family: 'Indie Flower', cursive;
}
.p1 {
background-color: red;
}
.p2 {
background-color: blue;
text-decoration: underline;
}
</style>
<body>
<p class="p1">
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunsahine
</p>
<p class="p2">
If you work just for money, you'll never make it,
but if you love what you're doing success will be yours
</p>
</body>
</html>
1 Like
مية مية محمد 
، فقط تخلص من الخواص font-family المتكررة والغير فعالة
<style>
body{
background: #3d442b ;
}
header {
color: #00bdff;
background-color:#f6f4ea;
width:400px;
text-align:center;
font-family:Gelasio,Ubuntu;
font-size:15px;
font-weight:700;
line-height:30px;
text-decoration:underline;
}
div p {
color:#f87e4d;
width:400px;
background-color:#faecb9;
text-align:center;
font-size:15px;
font-weight:700;
line-height:30px;
text-decoration:underline;
font-family:Gelasio,Ubuntu;
}
</style>
<html>
<head>
<meta charset="UTF-8">
<title>التنسيقيات CSS</title>
<link href="https://fonts.googleapis.com/css?family=Gelasio&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Ubuntu&display=swap" rel="stylesheet">
</head>
<body>
<main>
<header>
<p>Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunshine<p>
</header>
<div>
<p> If you work just for money, you'll never make it, but if you
love what you're doing success will be yours</p>
</div>
</main>
</body>
</html>
1 Like
مية مية ي احمد 
1 Like
شكرا اخي علي متابعتك
1 Like
لا شكر على واجب عزيزي
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title><link href="https://fonts.googleapis.com/css?family=Comfortaa&display=swap" rel="stylesheet"></title>
</head>
<style>
body{
background-color: #DAF7A6 ;
}
p{
background-color: #e86e56 ;
color:#ffffff;
font-family: 'Comfortaa', cursive;
font-size: 20px;
height:130px;
width:60%;
line-height:40px;
text-align:center;
}
div p{
background-color: #736a68 ;
text-decoration: underline;
}
</style>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunsahine
</p>
<div>
<p>
If you work just for money, you'll never make it,
but if you love what you're doing success will be yours
</p>
</div>
</body>
</html>
2 Likes
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>لغة التنسيقات</title>
<link href="https://fonts.googleapis.com/css?family=Sriracha&display=swap" rel="stylesheet">
<style type="text/css">
p{
width: 400px;
background-color: #ED8561;
color: white;
line-height: 40px;
font-family: 'Sriracha', cursive;
}
body{
background-color: #CBF198;
}
div p{
background-color: #4A68EC;
text-decoration-line: underline;
text-decoration-color: pink;
text-decoration-style: wavy;
}
</style>
</head>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunshine
</p>
<div>
<p>
If you work just for money, you'll never make it, but if you
love what you're doing success will be yours
</p>
</div>
</body>
</html>
2 Likes
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>مهمة التدرب على لغة التنسيقات</title>
<link href="https://fonts.googleapis.com/css?family=Lacquer&display=swap" rel="stylesheet">
</head>
<style>
body{
background-color: red;
color: white;
font-family: 'Lacquer', sans-serif;
text-lign: center;
}
p{
background-color: blue;
}
div p{
background-color: black;
text-decoration: underline wavy;
}
</style>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunsahine
</p>
<div>
<p>
If you work just for money, you'll never make it,
but if you love what you're doing success will be yours
</p>
</div>
</body>
</html>
2 Likes
جيد جدا سلمى 
1 Like
رائع عادل
1 Like
جيد ي محمد
هناك بعض الملاحظات
هذه الخاصيه اسمها text-align لذلك هي لم تطبق
ما رأيك اذا أضفت الخاصية line-height الى الفقرة النصية p وأعطيتها width
قم بالتعديلات ومعك إذا في أي استفسار
1 Like
مهمة التدرب على لغة التنسيقات
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>مهمة التدرب على لغة التنسيقات</title>
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
</head>
<style>
body {
background-color: #1A1C1E;
}
p {
background-color: #282B2D;
color: #fff;
font-family: 'Roboto', sans-serif;
font-size: 18px;
line-height: 28px;
}
div p {
background-color: #484D51;
color: #fff;
font-family: 'Roboto', sans-serif;
font-size: 16px;
line-height: 24px;
text-decoration: underline solid red;
}
</style>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunsahine
</p>
<div>
<p>
If you work just for money, you'll never make it,
but if you love what you're doing success will be yours
</p>
</div>
</body>
</html>
2 Likes
مهمة التدرب على تنسيقات النصوص 
:
1- Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>مهمة التدرب على لغة التنسيقات</title>
<link href="https://fonts.googleapis.com/css?family=Calistoga|Galada&display=swap" rel="stylesheet">
</head>
<style>
body {
background-color: #0E5C86;
}
p {
width: 400px;
background-color: aqua;
color: blueviolet;
font-family: 'Calistoga', cursive;
}
div p {
width: 400px;
background-color: blueviolet;
color: aqua;
font-family: 'Galada', cursive;
text-decoration: underline wavy greenyellow;
}
</style>
<body>
<p>
Never give up. Today is hard, tomorrow will be worse,
but the day after tomorrow will be sunsahine
</p>
<div>
<p>
If you work just for money, you'll never make it,
but if you love what you're doing success will be yours
</p>
</div>
</body>
</html>
2-img :
2 Likes
كل شيء تمام بقي فقط اضافه الخاصيه width للفقرة النصيه لانها الان بعرض الصفحة كاملة
1 Like