உங்கள் வலைப்பக்கத்தில் உள்ள ஒரு உறுப்புக்கு மென்மையான வெளிச்செலும்பு சேர்க்கப்பட்டுள்ளது, பார்வையாளருக்கு வெளியே நிற்க உறுப்பு ஏற்படுகிறது. ஒரு முக்கிய பொருளின் வெளிப்புற விளிம்புகளைச் சுற்றி ஒரு பளபளப்பைப் பயன்படுத்துவதற்கு CSS3 மற்றும் HTML ஐப் பயன்படுத்துக. விளைவு ஃபோட்டோஷாப் ஒரு பொருளை சேர்க்க ஒரு வெளி விளிம்பில் போல.
முதல் க்ளோவ் செய்ய அங்கம் உருவாக்கு
பளபளப்பு விளைவுகளை எந்த வண்ண பின்புலத்திலும் செய்யலாம், ஆனால் அவை இருண்ட பின்னணியில் அழகாக இருக்கும், ஏனென்றால் பின் ஒளியை இன்னும் மெருகூட்டுகிறது. இந்த வட்டமான மூலையில் செவ்வக பெட்டி எடுத்துக்காட்டாக, ஒரு DIV உறுப்பு மற்றொரு DIV உறுப்பு ஒரு கருப்பு பின்னணியில் வைக்கப்படுகிறது. வெளிப்புற டிஐவி ஒளிர்வுக்கு அவசியமில்லை, ஆனால் வெள்ளை நிற பின்னணியில் பளபளப்பை காண கடினமாக உள்ளது.
டிஐவிக்கு ஒரு பிரகாசமான கிளாஸ் கொடுங்கள்:
அங்கத்தின் அளவு மற்றும் நிறத்தை அமைக்கவும்
பின்னணி வண்ணம், அளவு மற்றும் எழுத்துருக்களைப் போன்ற நீங்கள் விரும்பும் எந்த பாணியையும் சேர்க்க, உறுப்புகளை தேர்வுசெய்த பிறகு நீங்கள் ஒரு பிரகாசத்துடன் அலங்கரிக்கப் போகிறீர்கள். இந்த உதாரணம் நீல செவ்வக ஆகும்; அளவு 90px மூலம் 147px அமைக்கப்படுகிறது; மற்றும் பின்னணி நிறம் # 1f5afe, ஒரு அரச நீலமாக அமைக்கப்படுகிறது. இது கருப்பு கொள்கலன் உறுப்பு நடுவில் உறுப்பு வைக்க ஒரு விளிம்பு அடங்கும்.
மூலைகளிலும் சுற்று
வட்டமான மூலைகளோடு ஒரு செவ்வகத்தை உருவாக்கி CSS3 உடன் எளிதாக உள்ளது. விளிம்பு வர்க்கத்தை எல்லை-ஆரம் பாணி சொத்து சேர்க்க. -Webkit- மற்றும் -moz- முன்னோடிகளை மிக உயர்ந்த பொருத்தப்பாட்டிற்கு பயன்படுத்துவதை நினைவில் கொள்ளுங்கள்.
-வெப்கிட்-எல்லை-ஆரம்: 15px;-ஒஸ்-எல்லை-ஆரம்: 15px;எல்லை-ஆரம்: 15px; ஒரு பெட்டி நிழல் கொண்ட ஒளியை சேர்க்கவும்
பளபளப்பு தன்னை ஒரு பெட்டியில் நிழல் கொண்டு உருவாக்கப்பட்டது. ஏனென்றால், நீங்கள் முழு மூலக்கூறையும் விரும்புகிறீர்களே, நிழல் போன்ற ஒரு பக்கத்தை ஒளிரச் செய்யாதீர்கள், கிடைமட்ட மற்றும் செங்குத்து நீளங்களை 0px ஆக அமைக்க வேண்டும். இந்த எடுத்துக்காட்டில், தெளிவின்மை ஆரம் 15px ஆக அமைக்கப்பட்டிருக்கும், மற்றும் தெளிவின்மை பரவல் 5px ஆகும், ஆனால் நீங்கள் அந்த அமைப்புகளுடன் பிடுங்கலாம் எப்படி பரந்த மற்றும் பரவலாக்க வேண்டும் என்பதை நீங்கள் தீர்மானிக்க வேண்டும். நிறம் RGB (255,255,190) RGBA ஆல்பா வெளிப்படைத்தன்மை கொண்ட ஒரு மஞ்சள் நிறம் 75 சதவிகிதம்-ரேகா (255,255,190, .75). உங்கள் திட்டத்திற்கு சிறந்த வகையில் வேலை செய்யும் ஒரு பளபளப்பு வண்ணத்தைத் தேர்வுசெய்யவும். மூலைகளை சுற்றி வருவதைப் போல, சிறந்த இணக்கத்திற்காக உலாவி முன்னொட்டுகளை (-webkit- மற்றும் -moz-) பயன்படுத்த மறக்காதீர்கள்.
-வெப்கிட்-பாக்ஸ்-நிழல்: 0px 0px 15px 5px rgba (255, 255, 190, .75);-moz-box-shadow: 0px 0px 15px 5px rgba (255, 255, 190, .75);பெட்டி நிழல்: 0px 0px 15px 5px rgba (255, 255, 190, .75); ஒளிரும் பெட்டி சோதிக்க
ஒன்று அல்லது அதற்கு மேற்பட்ட உலாவிகளில் ஒளிரும் பெட்டியை பரிசோதித்து, உங்கள் வலைப்பக்கத்திற்காக சிறப்பாக செயல்படும் பளபளப்பு விளைவுகளை வழங்குவதற்கு தேவையான மாற்றங்களை செய்யுங்கள்.
