`
samjavaeye
  • 浏览: 187613 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

四个实用的背景色和边框CSS实例

 
阅读更多

效果图:



代码如下:

<p style="background-color:#FDD;border:1px solid #F00;color:#34404F;font-weight:bold;padding:6px;border-radius:5px;box-shadow:5px 5px 5px #888888;">
	红色错误信息,圆角矩形带阴影。
</p>

<p style="background-color:#FFC;border:1px solid #FC0;color:#34404F;font-weight:bold;padding:6px;border-radius:5px;box-shadow:5px 5px 5px #888888;">
	黄色警告信息,圆角矩形带阴影。
</p>

<p style="background-color:#DFF4FF;border:1px solid #A7CEDF;color:#34404F;font-weight:bold;padding:6px;border-radius:5px;box-shadow:5px 5px 5px #888888;">
	蓝色提示信息,圆角矩形带阴影。
</p>

<p style="background-color:#F4FDEF;border:1px solid #ACDFA7;color:#384F34;font-weight:bold;padding:6px;border-radius:5px;box-shadow:5px 5px 5px #888888;">
	绿色成功信息,圆角矩形带阴影。
</p>

 

  • 大小: 13 KB
分享到:
评论

相关推荐

    JQuery&CSS;&CSS;+DIV实例大全.rar

    4.JS+CSS通用一个页面同时三个焦点图轮换效果完整实例 5.JS+CSS网页版模拟QQ登录框界面特效示例 6.JS+flash立柱广告代码仿百度MP3搜索右侧可伸缩的立柱广告效果 7.JS版本黑色超动感二级菜单导航模块代码 穿越...

    JavaScript_JQuery_CSS_CSS_DIV漂亮的实例123个

    3. jQuery+CSS实用图片收缩与放大效果插件 4. jquery+div实现同时滑动切换的图文展示特效插件下载 5. jquery+div带动画按钮图片手动与自动切换的特效代码 6. jquery一页多用的飞飞图片幻灯插件演示 7. jquery...

    精通CSS+DIV网页样式与布局视频教材

    5.1 背景颜色 5.1.1 页面背景色 5.1.2 用背景色给页面分块 5.2 背景图片 5.2.1 页面的背景图 5.2.2 背景图的重复 5.2.3 背景图片的位置 5.2.4 固定背景图片 5.2.5 添加多个背景图片 ...

    css网络大讲堂 mobi

    本书主要介绍了CSS的概念、类型、文本样式、边框样式、块样式、位置样式、列表和滤镜,同时还介绍了关于CSS的一些高级应用,...本篇主要介绍CSS和JavaScript结合的相关实例,还通过一个完整的案例综合介绍了CSS的应用。

    CSS教程:通过实例学习和理解CSS盒模型

    盒模型主要定义四个区域:内容(content)、内边框距(padding)、边框(border)和外边距(margin)。 自从1996年CSS1的推出,W3C组织就建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来...

    100多个JQuery效果示例(实例)div+css+javascrpit

    3. jQuery+CSS实用图片收缩与放大效果插件 4. jquery+div实现同时滑动切换的图文展示特效插件下载 5. jquery+div带动画按钮图片手动与自动切换的特效代码 6. jquery一页多用的飞飞图片幻灯插件演示 7. jquery仿...

    零基础学HTML+CSS-f7d6.mobi

    第三篇为第12~20章,详细介绍了CSS的字体、文本、背景、边框、定位、列表、选择符等知识点;最后一篇为第21~24章,包括实战案例和实战面试,先通过3个案例介绍了网页的设计思路,然后通过面试题考查读者所学。

    用CSS制作三角形和按钮的简单实例

    首先,四个三角形合并在一起的正方形,也就是正方形的四条边框形成的四个三角形 源代码: XML/HTML Code复制内容到剪贴板 &lt;!DOCTYPE html&gt;  &lt;html lang="en"&gt;  &lt;head&gt;  &lt;meta charset=...

    零基础学HTML+CSS+第2版-张熠.pdf

    第三篇为第15~30章,详细介绍了CSS的字体、文本、背景、边框、定位、列表、选择符等知识点;最后一篇为第31~34章,包括实战案例和实战面试,先通过3个案例介绍了网页的设计思路;然后通过面试题考查读者所学。 ...

    仿Word自动套用格式使用CSS设置表格样式实例

    找一个虽然不是很好看,但设置起来比较复杂的吧:彩色底纹-强调文字颜色6 Word中的效果如图示: 【样式分析】: Word中设置表格格式,主要是设置边框和底纹,可选定整个表格或者部分单元格右击→表格属性→边框和...

    CSS(二)

    top 塌陷二、CSS 元素溢出overflow 属性介绍:三、块元素、内联元素、内联块元素课堂练习四、浮动文档流浮动特性清除浮动五、定位关于定位定位元素特性定位元素层级CSS实现垂直居中的问题六、特征布局实例讲义 ...

    CSS3 RGBA色彩模式使用实例讲解

    RGBA色彩模式是RGB色彩模式的扩展,在红,蓝,绿三原色的...第四个参数表示不透明度,取值在0到1之间。 实例:设计带有阴影边框的表单 XML/HTML Code复制内容到剪贴板 &lt;!DOCTYPE html PUBLIC -//W3C//DTD XHT

    xml实用大全和轻松学习手册和无废话xml

    三个资料: xml实用大全 无废话xml xml轻松学习手册 XML轻松学习手册: · 第一章:XML快速入门 · 一. 什么是XML? · 二. XML是新概念吗? · 三. 使用XML有什么好处? · 四. XML很难学吗? · 五. XML和...

    HTML元素拖拽功能实现的完整实例

    元素可见的大小由其高度、宽度决定,包括所有内边距、滚动条和边框大小四个属性 offsetHeight:元素正在垂直方向上占用的大小空间,单位为px,不包括margin值。只读属性。 offsetWidth:元素在水平方向上占用的大小...

    XML实用大全(web开发必备手册)

    12.13.2 边框线属性... 381 12.13.3 贴边属性... 384 12.13.4 大小属性... 385 12.13.5 定位属性... 386 12.13.6 float属性... 386 12.13.7 clear属性... 387 12.14 本章小结... 389 第13章 级联样式单级别2....

    jQuery详细教程

    下面的例子把所有 p 元素的背景颜色更改为红色: 实例 $("p").css("background-color","red"); 更多的选择器实例 语法 描述 $(this) 当前 HTML 元素 $("p") 所有 &lt;p&gt; 元素 $("p.intro") 所有 class="intro" 的 &lt;p&gt; ...

Global site tag (gtag.js) - Google Analytics