请选择 进入手机版 | 继续访问电脑版

站长网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 1073|回复: 0

如何在图片加边框的html代码

[复制链接]
发表于 2015-9-13 10:24:24 | 显示全部楼层 |阅读模式
图片加边框的代码
   一.原图:醉夕阳的最爱——调皮小外孙


二.各种加框效果图
   1、简单线框   
  2、双线框   
  3、虚线框  
  4、凸出框:  

  5、嵌入框: 
 
  6、脊状框:   
  7、凹槽框  
 
  8、粒状阴影框  
三代码:
    1、简单线框   <img src="图片地址" style="border:5 solid #ffCCCC">
  2、双线框  <img src="图片地址" style=" border:7 double #666FF">
  3、虚线框  <img src="图片地址" style=" border:3 dashed #990000">
  4、凸出框:  <img src="图片地址" style="border:10 outset #CCCCFF">
  5、嵌入框:  <img src="图片地址" style="border:15 inset #ff9900">
  6、脊状框:  <img src="图片地址" style="border:15 ridge #33FF66">
  7、凹槽框  <img src="图片地址" style="border:15  groove #CC6666">
  8、粒状阴影框  <img src="图片地址" style="filter:progidXImageTransform.Microsoft.Glow(color=#ccFF66,strength=30">
.使用方法
  在您的博客发博文的编辑界面,在【显示源代码】前面打上勾后,加入您需用的代码(如第一排的:简单线框   <img src="图片地址" style="border:5 solid #ffCCCC">),换上你的图片网址,适当调整宽度和颜色,再将【显示源代码】前面的勾去掉,显示了加框的效果,满意点击【发博文】即可。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|站长网

GMT+8, 2021-7-29 10:30 , Processed in 0.146249 second(s), 28 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表