`
Shmily奕蝶
  • 浏览: 4360 次
  • 性别: Icon_minigender_2
  • 来自: 大理
最近访客 更多访客>>
社区版块
存档分类
最新评论

不用切图的页面圆角

css 
阅读更多
<style type="text/css">
<!--
.r {background:#ff0;border-right:1px solid #000;border-left:1px solid #000;height:1px;font-size:1px;overflow:hidden;display:block;}
.a1 {margin:0 5px; background:#000;}
.a2 {margin:0 3px; border-right-width:2px; border-left-width:2px;}
.a3 {margin:0 2px;}
.a4 {margin:0 1px; height:2px;}
.a5 {height:auto;font-size:medium;}
-->
</style>

<b class="r a1"></b><b class="r a2"></b><b class="r a3"></b><b class="r a4"></b>
<div class="r a5">test</div>
<b class="r a4"></b><b class="r a3"></b><b class="r a2"></b><b class="r a1"></b>
分享到:
评论

相关推荐

    suning_suning首页切图_

    【描述】中提到,这个项目仅仅涵盖了首页的部分切图,这意味着它可能不包含网站的所有页面和交互元素。这是一个适合初学者的案例,适合那些已经学习过HTML5和CSS3基础的人来练习和巩固技能。通过这样的练习,开发者...

    网站制作的切图技巧 网页设计中的切图技巧介绍(图文)

    对于带有圆角的导航条,可以将圆角部分单独切出,而渐变色部分同样切一个像素的条纹,然后将这些条纹合并到同一张图片中,通过CSS的`position`属性定位图片位置,以达到预期效果。 在处理图片格式时,要根据图片...

    1基础页面开发(1).md

    这一过程不仅要求开发者对这些前端技术有熟练掌握,还包括能够理解设计意图、进行切图以及复用页面组件等能力。 ### HTML HTML(HyperText Markup Language,超文本标记语言)是构建网页内容的骨架,它通过标签来...

    超级好用的jQuery圆角插件 Corner速成

    在CSS3之前,实现圆角效果通常需要复杂的切图技巧或使用图片作为边角,这无疑增加了前端开发的工作量。然而,jQuery Corner的出现使得在不支持CSS3圆角属性的浏览器(主要是旧版Internet Explorer)中也能轻松实现...

    CSS圆角边框制作指南与实例

    虽然圆角边框在视觉上可以增加页面的柔和感和现代感,但在早期的CSS标准中,实现这一效果并不直观,往往需要借助复杂的技术或者使用大量的切图。随着CSS3的引入,这个问题得到了显著改善。本文将探讨如何使用CSS3来...

    css 圆角边框

    在早期的网页设计中,由于许多浏览器不支持CSS3的圆角属性,设计师们通常采用切图的方法来实现圆角效果,即使用图像编辑软件制作四个不同角度的圆角图像,然后通过CSS将这些图像设置到HTML元素的相应位置,以形成...

    Macromedia网页设计师认证班4

    同时,课程还教授了一些高级技巧,如创建圆角表格、单线表格和一像素表格,这些都是提升网页设计专业性的关键点。通过29表格的实践,学员可以深入理解这些技巧。 最后,课程提供综合练习,要求学员模仿gotoread的...

    前端工具推荐PxCook

    它可以自动检测并标注出设计稿中的颜色、字体、边距、圆角等关键信息,省去了手动测量和记录的时间,提高了工作效率。同时,这些标注信息可以直接导出,供前端开发人员参考,减少了沟通成本和可能出现的误解。 **3....

    类苹果网站

    传统上,为了实现类似苹果官网那样的圆角效果,开发者通常需要使用切图(即多个图像拼接)的方式来达成,这不仅增加了页面加载时间,也不利于响应式设计。然而,在这个项目中,开发者巧妙地利用了CSS3的边框半径属性...

    星空引导页html源码+PSD源码.zip

    同时,CSS会应用于这些图像,实现如阴影、圆角、过渡和动画等效果。 对于初学者来说,研究这个星空引导页的源码可以深入了解网页布局的技巧,学习如何利用HTML和CSS创建动态效果,以及如何从PSD到HTML进行有效的...

    整站式开发1

    11. **四角圆角处理**:在IE6-IE8不支持圆角的情况下,可以使用三层嵌套的div结构,配合背景图片和位置调整实现类似效果。 12. **布局方式选择**:浮动布局和定位布局并不冲突,可以根据需求灵活选择。浮动适用于...

    华丽设计后台登录框psd模板下载_华丽后台登录框登录psd.rar

    例如,使用CSS3的边框阴影、圆角和过渡效果可以使登录框看起来更加立体和动态。 在实际应用中,开发者会将PSD模板转换为HTML/CSS代码,这通常涉及切图工作,将PSD中的设计元素导出为图片,然后在HTML中引用这些图片...

    UI团队文件及版本管理规范

    - **图层组命名**:依据页面框架来组织顶层图层组,如“XX-Bar”、“Sheet_功能描述.宽高v版本”等。 通过以上详细的内容介绍,我们可以看到UI团队在文件及版本管理方面制定了一系列规范,旨在提高工作效率、保证...

    将PSD效果图制作成XHTML+CSS博客界面全过程.doc

    1. **切图技巧**:首先,你需要从PSD文件中导出各个组成部分,如背景图、主体内容区、页脚、侧边栏和导航栏等。使用“导出为Web所用格式”功能,选择合适的图像格式(如JPG或PNG)和质量,以平衡文件大小和视觉效果...

    计算机生产实习报告.完整项目.docx

    - **流程**:一般包括需求分析、设计草图、原型设计、页面切图、前端开发等多个步骤。 3. **Photoshop软件的基本认识和使用** - **基本认识**:Photoshop是一款由Adobe公司开发的专业图像处理软件,广泛应用于...

    divbrush使用

    6. **智能解决方案**: 集成了纯CSS圆角边框、DIV居中等复杂样式的智能处理方法。 7. **可扩展性**: 用户可以自定义图库,增加个性化元素。 8. **语义化表达**: 允许用户自定义标签ID、Class等属性,提高代码的可读性...

    网课app ui .psd素材下载

    在网课app UI设计中,PSD文件可以完整保留设计细节,方便开发者或设计师进行后续的切图和优化。 2. **界面布局**:"learningapp.psd"可能包含了登录/注册、首页、课程列表、课程详情、播放界面、个人中心等多个页面...

    完整的令人惊叹的iOS_UI主题包_psd&amp;sketch素材下载.zip

    在这套素材中,PSD文件可能包含了各种UI组件,如按钮、导航栏、标签页、输入框、滑块、开关等,以及各种屏幕布局,如登录注册页、主页面、设置页等。设计师可以利用这些预设的元素快速构建出界面原型,并通过Photo...

Global site tag (gtag.js) - Google Analytics