用CSS的border和border-radius即可实现淡蓝色圆角边框：1.基础样式设border（如2px solid #add8e6）和border-radius（如8px）；2.推荐用类名.blue-round复用；3.可加box-sizing:border-box防布局偏移；4.备选色值包括#b0d4ff、#c5e0ff、hsl(200,100%,85%)。
直接用 CSS 的 border 和 border-radius 就能实现淡蓝色圆角边框，不需要额外标签或 JavaScript。
1. 基础样式：设置边框颜色、粗细和圆角
给图片（<img>）添加内联样式或外部类，关键属性是：
-
border：定义边框宽度、样式（必须写
solid）、颜色（如淡蓝色#add8e6或lightblue） -
border-radius：控制圆角程度，数值越大越圆润（常用
8px或12px）
示例（内联写法）：
<img src="photo.jpg" alt="示例图" style="border: 2px solid #add8e6; border-radius: 8px;">2. 推荐写法：用 CSS 类更清晰易复用
在 <head> 中加样式，或单独的 CSS 文件里写：
立即学习“前端免费学习笔记（深入）”；
.blue-round {border: 2px solid lightblue;
border-radius: 10px;
}
HTML 中调用：
<img src="photo.jpg" alt="示例图" class="blue-round">3. 小优化：避免边框影响布局（可选）
如果加了边框后图片位置偏移，可加 box-sizing: border-box，让边框包含在原尺寸内：
.blue-round {border: 2px solid lightblue;
border-radius: 10px;
box-sizing: border-box;
}
4. 淡蓝色备选色值参考
除了 lightblue，这些也常用且柔和：
-
#b0d4ff（更浅的天蓝） -
#c5e0ff（带点灰调，更稳重） -
hsl(200, 100%, 85%)（用 HSL 更直观控制亮度）
