Зертханалық жұмыс
жүктеу/скачать 85,91 Kb.
|
035756974378f7d254b3cf29ce1abaa3
- Бұл бет үшін навигация:
- Мақсаты
- Жұмыстың орындалу реті: 1. Теориялық материалды игеру. 2. Жұмыстың орындалуы. 3. Бақылау сұрақтары. Әдістемелік нұсқау
- Жеке бір тәг үшін жазылған стиль
|
19.03.20 ж Зертханалық жұмыс Тақырыбы: HTML-де CSS-ті қолдану технологиялар. CSS стилінің каскадты кестелері. Тұрғызылған стильдік безендірулер, style атрибуты. Стильдердің сатылы кестелері Жеке бір тэг үшін жазылған стиль Мақсаты: HTML тілінде CSS-ті қолдану технологияларын білу. Қажет құралдар мен қойылатын талаптар: дербес компьютер, Блокнот(Hotepad) және Internet Explorer программалары, сонымен бірге компьютерде қолданушы ретінде жұмыс жасай білу керек. Жұмыстың орындалу реті: 1. Теориялық материалды игеру. 2. Жұмыстың орындалуы. 3. Бақылау сұрақтары. Әдістемелік нұсқау CSS – Cascading Style Sheets (Стильдердің сатылы кестелері) —гипермәтіндік мәліметтер мазмұнын олардың экрандағы бейнелену формасынан бөліп орындауға мүмкіндік беретін құрал болып табылады. Қазіргі WWW-сайттарын безендіруді стильдердің сатылы кестелерінсіз көзге елестету қиын. Стильдердің сатылы кестелері мынадай мүмкіндіктер береді: • WWW-парағын безендіруді оның мазмұнынан бөліп тәуелсіз орындау; • Стандартты HTML тілі мүмкіндіктерін түбегейлі түрде кеңейту; CSS технологиясы, мысалы, объектілерді абсолюттік орналастыру ісін орындай алады, яғни объектілерді экранға нақты координаталар арқылы қажетті орынға шығаруға болады. Мұндағы объектілік модельдің координатасын программада өзгерту экрандағы сол элементтің орнын ауыстыра алады. Олардың ара қашықтықтарын өзімізге ыңғайлы болып табылатын өлшемдердің бірі - мм, см немесе дюйм, пункт арқылы беруге де болады. CSS сценарийлермен қосыла отырып, гипермәтіндік парақтарды кәсіби программаларда жасалған мультимедиялық өнімдерден айнымайтын динамикалық әрі интерактивті деңгейде көрсетуге мүмкіндік береді. «Скриптер» немесе «сценарийлер» – гипер-мәтіндерді түрлендіре алатын арнайы программалау тілінде жазылған программалық кодтар. JavaScript – кодтарын HTML- мәтіндеріне енгізе отырып, құжаттарды түрлендіре алатын, көпшілікке арналған тіл. Сценарийлер енгізілген CSS статикалық HTML-тілін динамикалық жаңа күйге келтіретін қосымша мүмкіндіктер жиыны. • CSS арқылы HTML-тілінің экрандағы элементтерді бейнелеудің көптеген тәсілдеріне жауапты тәгтер мен олардың атрибуттарын алып тастау жолымен файлдың жалпы көлемін кішірейте аламыз (мысалы, мынадай тәгтер: , т. б. ; атрибуттар: align, color, bgcolor, size, width, height, т. с. с.); • HTML тілінің тәгтері мен атрибуттарына қарағанда, CSS кестелері сайттың сыртқы түрін басқарудың жеңіл тәсілдерін береді; • бір файлдағы стиль сипаттамаларын өзгерту арқылы жүздеген гипермәтіндік парақтардың сыртқы түрлерін бірден өзгерте аламыз. Стильді бір тәгтің параметрлері ішіне жазуға болады. Ол үшін BODY ішіндегі кез келген тәгке (BODY тәгіне де) STYLE атрибуты қолданылады. Бұларды "инлайндық" стиль кестелері деп атайды. STYLE атрибуты арқылы - Жеке тәг стилі; - Жеке HTML-файлы стилі; - Бірнеше HTML-файлдарына арналған стиль; - Аралас стильдерді пайдалану атқарылады. Жеке бір тәг үшін жазылған стиль Мысалы, тәгі арқылы нақты бір азат жол қалай бейнеленетінін былай көрсете аламыз: <Р > Бұл азат жолқа стильдік анықтау тәсілі қолданылып отыр. Стиль style атрибутымен берілген. Мұнда браузерге азат жолты көлемі 1.5 сантиметр болатын жасыл әріптермен жазуға нұсқау берілген. Стильді анықтау мынадай түрде жазылады: сипаттамасы: шамасы; font-size:1.5cm; color:green; Әрбір анықтаулар бір-бірінен «;» символы арқылы бөлініп жазылады. Style атрибутын оның параметрлері арқылы әрбір тәгке қолдана аламыз. Енді стильдер қолданылатын бір мысалды толығырақ қарастырайық: Бір тәг үшін жазылған стиль
саламатсыз ба, бұл менін web бетім. Ол әлі жүктеліп жатыр ... ... Сәлден соң ашылады Винни-Пух в гостях у Кролика При работе на вычислительной технике необходимо сесть так, чтобы руки с предплечьями образовывали прямой угол, глаза поставить на расстояние 30-40 см от рабочей поверхности монитора. жүктеу/скачать 85,91 Kb. Достарыңызбен бөлісу:
|