Photoshop วิธีทำมุมโค้งมน วิธีทำมุมโค้งมนของรูปภาพ ภาพถ่าย หรือวัตถุอื่น ๆ ใน Photoshop อย่างรวดเร็ว
การทำงานใน Photoshop ช่วยให้คุณได้ผลลัพธ์เดียวกันในรูปแบบต่างๆ แต่โดยธรรมชาติแล้ว การใช้เส้นทางที่เรียบง่ายและมีประสิทธิภาพที่สุดเท่าที่เป็นไปได้จะมีเหตุผลมากที่สุด ควรสังเกตว่าการครอบตัดรูปภาพเป็นรูปสี่เหลี่ยมผืนผ้าใน Photoshop เกิดขึ้นโดยใช้เครื่องมือ "ครอบตัด" แบบง่ายๆ ในเวลาเดียวกันการบรรลุผลลัพธ์ที่คล้ายกัน แต่ด้วยขอบโค้งมนนั้นค่อนข้างยากสำหรับผู้ใช้มือใหม่เนื่องจากโปรแกรมไม่ได้เสนอวิธีแก้ปัญหาที่ชัดเจน
ก่อนที่คุณจะปัดเศษขอบใน Photoshop คุณควรเข้าใจว่าทำไมจึงจำเป็น สาเหตุหลักคือ:
การได้ภาพหรือรายละเอียดที่มีรูปร่างตามที่ต้องการโดยไม่จำเป็นต้องแก้ไขเพิ่มเติม
รับการออกแบบดั้งเดิมและสวยงามสำหรับการถ่ายภาพ
ดังนั้นเมื่อเปิดตัว Photoshop คุณจะต้องเพิ่มไฟล์ที่จะครอบตัด ในการดำเนินการนี้คุณสามารถใช้รายการเมนู "ไฟล์", "เปิด" หรือเพียงแค่ลากภาพถ่ายไปไว้ในสภาพแวดล้อมการทำงานของโปรแกรม ในการที่จะปัดเศษขอบใน Photoshop คุณต้องกำหนดขนาดรูปภาพให้เหมาะสมก่อน ซึ่งสามารถทำได้ผ่าน "รูปภาพ", "ขนาด" หรือเมื่อสร้างเอกสารใหม่ตามขนาดที่กำหนดแล้วให้ย้ายไฟล์ที่ต้องการลงไป ที่นั่นคุณสามารถเปลี่ยนรูปได้ขึ้นอยู่กับดุลยพินิจของคุณเองโดยใช้ "การแก้ไข", "การเปลี่ยนแปลง"
เมื่อเตรียมตัวอย่างการทำงานด้วยวิธีนี้ คุณสามารถดำเนินการตามขั้นตอนการปัดเศษขอบใน Photoshop ได้โดยตรง ในการทำเช่นนี้คุณจะต้องค้นหาเครื่องมืออย่างใดอย่างหนึ่งบนแผงด้านซ้ายซึ่งเรียกว่า "สี่เหลี่ยมผืนผ้า" (เรียกโดยปุ่ม "U") และเลือกจากรายการพันธุ์ - "มีขอบโค้งมน" ผู้ใช้สามารถปรับมุมของขอบโค้งมนได้โดยใช้ตัวเลือก "รัศมี" ซึ่งจะพร้อมใช้งานที่แผงด้านบน
จากนั้นคุณควรเลือกส่วนที่ต้องการของภาพ ที่นี่คุณควรสังเกตว่าสี่เหลี่ยมที่ได้นั้นซ้อนทับกับภาพถ่ายต้นฉบับหรือไม่ หากเป็นกรณีนี้ ในแผงเลเยอร์ที่อยู่ทางด้านขวา คุณควรลดเลเยอร์ที่สร้างขึ้นใหม่ลงโดยเลือกให้อยู่ในตำแหน่งที่จะต่ำกว่าตัวอย่างการทำงาน การเลือก - ในกรณีนี้คือ "สี่เหลี่ยมมุมมน" - สามารถย้ายได้โดยใช้เครื่องมือปกติของโปรแกรม
เพื่อให้เข้าใจวิธีการปัดเศษขอบใน Photoshop คุณต้องคลิกขวาที่เลเยอร์ที่มีสี่เหลี่ยมผลลัพธ์แล้วเลือก "สร้างการเลือก" จากนั้นบนแผงหลักที่ด้านบน ให้คลิก "เลือก", "กลับด้าน" จากนั้นยังคงไปที่เลเยอร์ที่มีรูปภาพหลักและใช้คำสั่ง "ลบ" ซึ่งดำเนินการโดยการกดปุ่มที่เกี่ยวข้องบนแป้นพิมพ์หรือผ่านปุ่มลัด "D" ผลลัพธ์สามารถบันทึกผ่านเมนู "ไฟล์", "บันทึก" สำหรับรูปแบบ PSD "ดั้งเดิม" เท่านั้น หรือคุณสามารถใช้ "บันทึกเป็น..." เพื่อให้ได้ผลลัพธ์ในรูปแบบทั่วไปอื่นๆ
นี่เป็นวิธีที่ง่ายและรวดเร็วที่สุดในการปัดเศษขอบใน Photoshop ตอนนี้ก็ขึ้นอยู่กับจินตนาการของคุณที่จะตัดสินใจว่าจะนำความรู้ใหม่ของคุณไปประยุกต์ใช้ที่ไหน
อัพเดทล่าสุด:18/01/59
วิธีปัดเศษมุมในรูปภาพใน Photoshop
เมื่อออกแบบบล็อก ฉันได้สร้างมุมโค้งมนบนรูปภาพซ้ำแล้วซ้ำอีก แต่สิ่งที่ทำไม่บ่อยนักและไม่เพียงพอโดยอัตโนมัติจะถูกลืมไปอย่างรวดเร็ว และฉันก็บ่นอีกครั้งเกี่ยวกับความจำเป็นในการอธิบายงานที่ทำเสร็จทันที ดังนั้นตอนนี้เกือบจะไม่ชักช้าฉันจะอธิบายลำดับของการกระทำ จริงอยู่ที่เพราะโรคนี้ "รอยร้อน" จึงไม่ร้อนอีกต่อไป
สำหรับผู้ที่ชอบดูทุกอย่าง วิดีโอสั้น ๆ เกี่ยวกับ “วิธีปัดเศษมุมใน Photoshop”:
ก่อนอื่นคุณต้องมี Photoshop จะหาได้ที่ไหนมีสองตัวเลือก:
- ซื้อบนเว็บไซต์อย่างเป็นทางการ
- ค้นหาบนทอร์เรนต์
ตัวเลือกใดที่จะเลือกขึ้นอยู่กับคุณ
ดังนั้นเรามาเปิดตัว Photoshop กันดีกว่า เปิดรูปภาพที่ต้องปัดเศษมุมใน Photoshop (ไฟล์ → เปิด) หากขนาดรูปภาพใหญ่กว่าที่คุณต้องการ คุณสามารถเปลี่ยนขนาดได้ (รูปภาพ → ขนาดรูปภาพ)
ทางด้านขวาของภาพตัวอย่างจะมีแม่กุญแจเล็กๆ ที่บล็อกการแก้ไขภาพต้นฉบับ (เลเยอร์พื้นหลัง) หากต้องการสร้างเลเยอร์ใหม่และใช้งานให้ดับเบิลคลิกด้วยปุ่มซ้ายของเมาส์ อย่าเปลี่ยนแปลงสิ่งใดในหน้าต่างที่ปรากฏขึ้น คลิก "ใช่"
หากไม่มีล็อค แสดงว่ามีสองสิ่งต่อไปนี้:
หรือใน Photoshop เวอร์ชันของคุณ เลเยอร์พื้นหลังสามารถแก้ไขได้ (ซึ่งเป็นที่น่าสงสัย แต่กะทันหัน)
หรือด้านบนสามารถทำได้โดยใช้การดำเนินการอื่น: จากด้านบนในแถบเมนูเลือก "เลเยอร์" ในเมนูย่อยที่เปิดขึ้นเลือก "ใหม่" และปฏิบัติตามลูกศร - "จากพื้นหลัง" และในหน้าต่างเดียวกัน ที่เปิดขึ้นให้คลิก "ใช่"
เลือก "สี่เหลี่ยมผืนผ้าที่มีมุมโค้งมน" ในเครื่องมือ
เลือกโหมดที่ด้านบนของแผงการตั้งค่า: "โครงร่าง" ตั้งค่ารัศมีเป็นมุมมนใน Photoshop ฉันเลือก 40 พิกเซล คุณสามารถเลือกอันที่เหมาะกับรูปภาพของคุณได้
วาดรูปสี่เหลี่ยมผืนผ้าตามขนาดที่ต้องการในภาพ: วางเคอร์เซอร์ (ใช้รูปกากบาท) ที่จุดที่ต้องการทางด้านซ้ายบนและโดยไม่ต้องปล่อยปุ่มเมาส์ให้เลื่อนไปที่มุมตรงข้ามไปยังจุดที่ต้องการ รูปภาพของเรามีสี่เหลี่ยมผืนผ้าโปร่งใสและมีมุมโค้งมน
คลิกขวาที่สี่เหลี่ยม ในเมนูบริบทเลือก "สร้างพื้นที่ที่เลือก" ตั้งค่ารัศมีขนนกเป็น 1 พิกเซลแล้วคลิกปุ่ม "ใช่"
ใช้เมนูเลือก → กลับด้าน เลือกทุกอย่างที่อยู่นอกสี่เหลี่ยมมุมมน แล้วลบส่วนที่เลือกด้วยปุ่ม Delete
หากคุณไม่ได้วางสี่เหลี่ยมทับทั้งภาพ คุณสามารถลบพื้นหลังโปร่งใสส่วนเกินออกได้โดยใช้ลำดับคำสั่ง รูปภาพ → การตัด → ขึ้นอยู่กับพิกเซลโปร่งใส → ใช่
เราได้ภาพที่มีมุมโค้งมน เราบันทึกไว้สำหรับเว็บ: ไฟล์ → บันทึกสำหรับเว็บและอุปกรณ์ เลือกค่าที่ตั้งล่วงหน้า: PNG-24 ความโปร่งใส แล้วคลิกบันทึก ในรูปแบบ PNG-24 รูปภาพจะถูกบันทึกโดยมีพื้นหลังโปร่งใส เพื่อให้สามารถฝังลงในการออกแบบเว็บไซต์ใดๆ ได้ 
สิ่งเดียวกันนี้สามารถทำได้ด้วยเครื่องมือ Ellipse จากนั้นคุณจะได้ภาพทรงกลมหรือในกรอบวงรี
วันนี้เราได้เรียนรู้วิธีการปัดเศษมุมของรูปภาพใน Photoshop
เบราว์เซอร์สมัยใหม่ทั้งหมดรองรับมาตรฐานมาร์กอัปไฮเปอร์เท็กซ์ HTML5 และสไตล์การออกแบบ CCS3 และหากไซต์ของคุณ (เทมเพลต) รองรับมาตรฐานสมัยใหม่ คุณสามารถเปลี่ยนแปลงการออกแบบได้ เช่น มุมโค้งมน เงา การเติมไล่ระดับสี โดยไม่ต้องใช้โปรแกรมแก้ไขกราฟิก
เว็บมาสเตอร์ทุกที่ใช้มุมโค้งมนบนบล็อกและเฟรมบนเว็บไซต์ ในบทความนี้ ฉันจะบอกวิธีปัดเศษมุมของรูปภาพและรูปถ่ายบนเว็บไซต์โดยไม่ต้องใช้โปรแกรมของบุคคลที่สาม โดยใช้ CSS เท่านั้น
เพื่อให้ตัวอย่างที่ให้ไว้ในบทความแสดงบนหน้าจอได้อย่างถูกต้อง คุณต้องใช้เบราว์เซอร์เวอร์ชันล่าสุด, FireFox, Chrome และเบราว์เซอร์ที่อิงตาม: Yandex.Browser, Amigo และอื่นๆ
การปัดเศษมุมของบล็อก DIV
ตามมาตรฐาน CSS3 ดังนั้นการบล็อก กรมมีมุมโค้งมน ก็ต้องจัดสไตล์ รัศมีชายแดนตัวอย่างเช่น:
รัศมีเส้นขอบ: 10px;
เพื่อความชัดเจน ให้วาดสองบล็อกที่มีมุมตรงและมุมมน:
บล็อกที่มีมุมขวา
บล็อกที่มีมุมโค้งมน
การปัดเศษมุมของรูปภาพ
โดยการเปรียบเทียบกับตัวอย่างข้างต้น คุณสามารถปัดเศษมุมของรูปภาพบนเว็บไซต์ได้ เช่น ภาพถ่าย เพื่อความชัดเจนเรามาปัดมุมสำหรับรูปภาพจากเพจกัน
นี่คือภาพที่ไม่มีการประมวลผล CSS
และตอนนี้มีมุมโค้งมน:
รัศมีเส้นขอบ: 10px;
เพื่อให้ “สวยงาม” จริงๆ เรามาเพิ่มขอบตั้งแต่ต้นกันดีกว่า...
รัศมีขอบ: 10px; เส้นขอบ: 5px #ccc ทึบ;
แล้วก็เงา:
รัศมีขอบ: 10px; เส้นขอบ: 5px #ccc ทึบ; กล่องเงา: 0 0 10px #444;
ตัวเลือกด้านล่าง (มุมโค้งมนที่มีเงาไม่มีขอบ) ดูคล้ายกับแผ่นรองเมาส์มาก:
รัศมีเส้นขอบ: 10px; กล่องเงา: 0 0 10px #444;
และในที่สุดก็เป็นการเยาะเย้ยภาพอย่างสมบูรณ์
รัศมีชายแดน: 50%; เส้นขอบ: 5px #cfc ทึบ; กล่องเงา: 0 0 10px #444;
หากคุณเปิดภาพในหน้าต่างใหม่ คุณจะเห็นว่าภาพนั้น (ภาพ) ไม่มีการเปลี่ยนแปลง และมุม เงา และอื่นๆ ทั้งหมดเป็นเพียงผลลัพธ์ของการประมวลผล ซีเอสเอสสไตล์โดยเบราว์เซอร์ของคุณ
การพูดนอกเรื่องโคลงสั้น ๆ
สไตล์ ชายแดนเพิ่มขนาดภาพตามจำนวนเส้นขอบ หากมีการระบุค่าไว้ ขอบ: 5pxจากนั้นภาพสุดท้ายจะกว้างขึ้นและสูงขึ้น 10 พิกเซล โปรดทราบว่าในบางกรณี รูปแบบของเว็บไซต์อาจไม่ทำงาน
มีสไตล์ กล่องเงาไม่ส่งผลต่อขนาดของภาพ ดูเหมือนว่าเงาจะทอดทับองค์ประกอบข้างเคียง เมื่อใช้งานเค้าโครงของไซต์จะไม่ได้รับผลกระทบ
วิธีปัดเศษมุมของรูปภาพใน WordPress
ในตัวอย่างทั้งหมดข้างต้น ฉันเขียนสไตล์โดยตรงในแท็กโค้ด html ตัวอย่างเช่นอันสุดท้ายมีลักษณะดังนี้:
ซึ่งเป็นวิธีที่ดีเมื่อคุณต้องการจัดเรียงรูปภาพหรือรูปถ่ายหนึ่งรูปใหม่ จะทำอย่างไรถ้าคุณต้องการเปลี่ยนทุกอย่าง? คุณจะไม่ปีนไปทั่วไซต์ของคุณเพื่อแก้ไขการแสดงผลของแต่ละรายการ ในกรณีส่วนใหญ่ แท็ก WordPress ไอเอ็มจีกำหนดคลาสสไตล์หลายคลาส รายการหนึ่งตามชื่อเฉพาะของไฟล์รูปภาพ อีกรายการตามขนาด และอีกรายการตามการจัดตำแหน่ง คุณสามารถเสริมหนึ่งในนั้นด้วยพารามิเตอร์ข้างต้น
ตัวอย่างเช่น สำหรับรูปภาพทั้งหมดที่ไม่ได้ระบุการจัดแนวไว้ในไฟล์ สไตล์.cssสำหรับธีม WordPress ของคุณ ให้ป้อนข้อมูลต่อไปนี้:
จัดแนว ( รัศมีเส้นขอบ: 10px; เส้นขอบ: 5px #cfc solid; กล่องเงา: 0 0 10px #444; )
หรือวิธีการที่เข้มงวดที่สุดในการลงรูปภาพทั้งหมดบนเว็บไซต์ มากำหนดสไตล์ใหม่สำหรับแท็กทั้งหมดกัน ไอเอ็มจี:
Img ( รัศมีเส้นขอบ: 10px; เส้นขอบ: 5px #cfc solid; กล่องเงา: 0 0 10px #444; )
ตัวเลือกสุดท้ายไม่เพียงเหมาะสำหรับ WordPress เท่านั้น แต่ยังเหมาะสำหรับ CMS ใด ๆ และแม้กระทั่งเรื่องง่ายๆ HTMLหน้าในกรณีที่เมื่อแสดงภาพแท็ก ไอเอ็มจีไม่มีการกำหนดคลาสสไตล์ แต่ต้องระวัง. หากคุณแทนที่ตัวเลือกการแสดงแท็ก ไอเอ็มจีคุณจะเปลี่ยนรูปลักษณ์ของรูปภาพทั้งหมดบนเว็บไซต์!
แทนที่จะได้ข้อสรุป
ตัวอย่างทั้งหมดในบทความมีเงื่อนไขและมีจุดมุ่งหมายเพื่อแสดงความสามารถบางอย่างของ CSS สำหรับการประมวลผลภาพเท่านั้นและแสดงให้เห็นว่ามันง่ายแค่ไหน
CTRL+N หรือเลือกฟังก์ชัน "สร้าง" ในรายการแบบเลื่อนลงจากเมนู "ไฟล์" จากนั้น จากรายการเดียวกัน ให้เลือกการดำเนินการ "นำเข้า" หรือเรียกโดยใช้คีย์ผสม CTRL+I จากนั้นระบุเส้นทางไปยังไฟล์รูปภาพในกล่องโต้ตอบแล้วคลิกปุ่ม "นำเข้า" ของคุณจะปรากฏบนนี้
ในแถบเครื่องมือ ค้นหาการเปิดตัว "Node Editor" และเลือกเครื่องมือ "Shape" สามารถเรียกใช้เครื่องมือนี้ได้โดยการกดปุ่ม F10
ทางด้านขวาของมุมคุณต้องปัดเศษให้คลิกซ้ายที่ขอบของภาพ โหนดใหม่จะปรากฏในภาพ นอกเหนือจากโหนดทั้งสี่มุม จากนั้นเลือกตัวเลือก Convert Line To Curve ในแผง Node Editor เครื่องหมายกลมจะปรากฏทางด้านซ้ายของโหนดที่สร้างขึ้นใหม่
ที่ระยะห่างจากมุมเท่ากัน ให้เพิ่มโหนดใหม่ในด้านตั้งฉากของรูปภาพ โดยไม่ต้องเปลี่ยนเครื่องมือ Shape ให้ดับเบิลคลิกที่โหนดมุมหลัก โหนดนั้นจะถูกลบ มุมโค้งมนของภาพจะสังเกตเห็นได้ทันที คุณสามารถใช้เครื่องหมายบอกแนวเส้นตรงเพื่อเปลี่ยนรัศมีมุมได้
ด้วยวิธีง่ายๆ (โดยใช้วัตถุเวกเตอร์) คุณสามารถทำทุกอย่างได้ มุมในภาพสี่เหลี่ยม โดยไม่ต้องใช้วิธีการแก้ไขโหนดข้างต้น ให้วาดรูปสี่เหลี่ยมที่มีขนาดเท่ากันถัดจากรูปภาพที่นำเข้าด้วยเครื่องมือสี่เหลี่ยมผืนผ้า หรือเรียกใช้เครื่องมือด้วยปุ่ม F6
ด้วยเครื่องมือ "รูปร่าง" ที่คุณคุ้นเคยอยู่แล้ว ให้คลิกที่สี่เหลี่ยมแล้วลากเมาส์ไปเหนือโหนดใดๆ ของมันไปทางสี่เหลี่ยม มุมจะโค้งมน สามารถปรับรัศมีความโค้งได้ด้วยเครื่องมือเดียวกัน
ทำเครื่องหมายรูปภาพของคุณด้วยลูกศรของ Pick Tool
จากนั้นในรายการเมนูหลัก ให้ค้นหาการเปิดตัว "เอฟเฟกต์" และเลือกตัวเลือก "PowerClip" และฟังก์ชัน "Place Inside Container" จากรายการแบบเลื่อนลง ใช้ลูกศรกว้างเพื่อชี้ไปที่สี่เหลี่ยมที่คุณวาดด้วยมุมโค้งมน มันจะกลายเป็นกรอบที่จะวางภาพของคุณ
โปรดทราบ
โปรดทราบว่าการนำเข้ารูปภาพลงในเอกสาร Corel Draw จะไม่เปลี่ยนไฟล์รูปภาพต้นฉบับ ดังนั้นคุณจึงสามารถใช้รูปภาพดังกล่าวในรูปแบบดั้งเดิมได้หากคุณไม่พอใจกับผลลัพธ์ที่มีมุมโค้งมน
คำแนะนำที่เป็นประโยชน์
เมื่อใช้ฟังก์ชัน PowerClip คุณสามารถวางภาพในกรอบต่างๆ ที่มีรูปร่างแปลกประหลาดที่สุดได้
แหล่งที่มา:
- คู่มืออย่างเป็นทางการของ Corel Draw, M. Matthews, K. Matthews, 1997
- ทำอย่างไรให้มุมแหลมเรียบ?
คุณจะต้อง
- - คอมพิวเตอร์
- - โปรแกรม Adobe Photoshop
- - รูปถ่าย
คำแนะนำ
คลิกขวาที่เลเยอร์พื้นหลัง เลือก Duplicate Layer แล้วคลิก OK (หรือ Ctrl+J) จากนั้นสร้างเลเยอร์ใหม่ (Ctrl+Shift+N) วางไว้ระหว่างพื้นหลังและสำเนาดังที่แสดงในภาพหน้าจอ (คุณสามารถเติมสีบางสีได้ เช่น สีขาว) ปิดการใช้งานเลเยอร์ที่ถูกล็อค (คลิกที่ "ตา" ทางด้านซ้าย) หรือลบออก
ในแผงเครื่องมือ ให้ค้นหาปุ่มที่มีรูปสี่เหลี่ยมผืนผ้า (เครื่องมือสี่เหลี่ยมผืนผ้า) แล้วกดค้างไว้ด้วยปุ่มซ้ายของเมาส์ เมนูเพิ่มเติมจะปรากฏขึ้นในตำแหน่งที่คุณต้องการ (เครื่องมือสี่เหลี่ยมผืนผ้าโค้งมน) ตั้งค่าในส่วนบนให้เหมือนกับในภาพหน้าจอ และเปลี่ยนฟิลด์ Radius ตามที่คุณต้องการ (ยิ่งมีขนาดใหญ่ มุมก็จะยิ่งกลมมากขึ้น และภาพจะถูกครอบตัดมากขึ้น)
จากนั้นเลือกส่วนของรูปภาพที่คุณต้องการใช้ (เช่น เป็นอวตาร) หากคุณทำผิดพลาด ให้กดปุ่ม Esc และทำซ้ำการเลือก หลังจากเลือกแฟรกเมนต์ที่ต้องการแล้ว ให้คลิกขวาที่แฟรกเมนต์นั้นแล้วเลือก Make Selection... และคลิก OK
เสร็จแล้วคุณจะได้เลเยอร์รูปภาพที่มีมุมโค้งมน ตอนนี้เลเยอร์ 2 (อันที่ทำหน้าที่เป็นพื้นหลัง) สามารถเติมสีใดก็ได้หรือปล่อยให้โปร่งใส
วิดีโอในหัวข้อ
โปรดทราบ
ไฟล์ png แบบโปร่งใสเป็นรูปแบบที่ยอดเยี่ยม แต่ไม่ใช่ว่าบริการออนไลน์ทั้งหมด (โซเชียลเน็ตเวิร์ก บล็อก ฯลฯ) จะรองรับไฟล์ png แบบโปร่งใส หากผลของมุมโค้งมนไม่ได้ผล ก็มีทางออกอื่น
เลือกสีสำหรับพื้นหลัง (เลเยอร์ 2) ที่ใกล้กับสีบนหน้าที่คุณกำลังวางรูปภาพมากที่สุด จากนั้นบันทึกไฟล์เป็นไฟล์ jpg
ปัจจุบันรูปภาพที่มีขอบโค้งมนเป็นที่นิยม นี่ไม่ใช่เรื่องยากเลยโดยเฉพาะถ้าคุณเตรียมเทมเพลตสำหรับงานต่อไป
คุณจะต้อง
- โปรแกรมอะโดบี โฟโต้ชอป