การสร้างเว็บรูปแบบ photorealistic -- CSS / XHTML ใช้ได้ |
|
เปิดภาพใน Photoshop จากนั้นไปที่เมนูแก้ไข> กําหนดรูปแบบ เลือกชื่อสำหรับรูปแบบนี้และคลิก OK คลิ๊กกว่ารูปแบบของคุณกับ Paint Bucket Tool . คุณจะมีบางอย่างเช่นนี้ ตั้งค่าสีพื้นหน้าไปยัง # 49290a และมี โค้งสี่เหลี่ยมผืนผ้าเครื่องมือ สร้างรูปทรงและวางไว้ในเค้าโครงของกลาง เพิ่มรูปแบบชั้นต่อไปนี้ คุณจะต้องเพิ่มรูปร่างอื่น ๆ เหนือรูปร่างสีน้ำตาลนี้ ขณะนี้โปรดใช้สีขาว โปรดใช้รูปแบบชั้นเดียวกับที่คุณได้ใช้เวลาสองสามวินาทีที่ผ่านมา ซึ่งเป็นผล ทางด้านขวาล่างของรูปแบบฉันจะเพิ่มภาพสต็อกบางคนที่มีกระถางต้นไม้และโซฟา ภายใต้โซฟาชั้นกับฉันจะสร้างรูปทรงกลมที่มี Ellipse Tool ฉันจะไปที่ Filter> Blur> Gaussian เบลอแล้วผมจะใช้การตั้งค่าต่อไปนี้ ด้วยวิธีนี้คุณจะมีเงาจริงภายใต้โซฟา ที่ด้านซ้ายของรูปแบบที่ผมจะสร้างกล่องบางคนที่มี สี่เหลี่ยมผืนผ้าเครื่องมือ รูปทรงมีลักษณะดังต่อไปนี้ชั้น ฉันจะเพิ่มข้อความและภาพ ทางด้านขวาของฉันจะเพิ่มบางป้าย ฉันจะสร้างเส้นประระหว่างการโพสต์ เมื่อต้องการสร้างเส้นประคุณจำเป็นต้องใช้ เครื่องมือชนิดแนวนอน และใช้ตัวอักษรต่อไปนี้และการตั้งค่า ขั้นตอนสุดท้ายของฉันคือการสร้างโลโก้และข้อความบางปุ่ม นี้เป็นรูปสุดท้ายของฉัน ฉันหวังว่าคุณจะชอบมัน ที่คุณสามารถดูมันทำง่ายมากและต้องใช้เพียงบางภาพหุ้นที่ดี คุณสามารถดาวน์โหลดเค้าโครง PSD และ CSS / เค้าโครง xhtml ส่วนการเขียนโปรแกรมสำหรับรูปแบบนี้สร้างโดยเทคนิคเดียวกันฉันได้ใช้สำหรับการกวดวิชา : การออกแบบและรหัสรูปแบบโดยไม่ต้องใช้เครื่องมือชิ้น (กวดวิชาเฉพาะสำหรับสมาชิกวีไอพี) |
layout
|
|