postion_relative_absolute

简介: 为标题栏增加边既美观又大方 实现方式html结构: 1 2 标题3 更多>>4 5 6 css样式: 1 *{margin:0px; padding:0px;}2 .

为标题栏增加边既美观又大方


实现方式
html结构:

1 <div class="title">
2 <span>标题</span>
3 <a href="#" target="_blank">更多&gt;&gt;</a>
4 <div class="sidebar">
5 </div>
6 </div>

css样式:

1   *{margin:0px; padding:0px;}
2 .title{width:960px;height:35px;line-height:35px;position:relative;background:#10A6D7;margin:0 auto;margin-top:30px;}
3 .title span{padding-left:15px;}
4 .title a{float:right;padding-right:15px}
5 .title .sidebar{width:7px;height:35px;position:absolute;top:0px;left:-7px;background:url(./images/pic_left.jpg) no-repeat;}



目录
相关文章
|
3月前
|
设计模式 Java Linux
Java I/O的演进——从BIO到NIO再到AIO的异步革命
Java I/O模型经历了从阻塞I/O(BIO)到非阻塞I/O(NIO)再到异步I/O(AIO)的演进,每一次演进都是对高并发、高吞吐量需求的回应。
190 1
|
3月前
|
存储 人工智能 安全
阿里云服务器高性价比实例:通用算力型u1/u2i/u2a实例相比于经济型及九代c9i/g9i/r9i实例有何优势?
阿里云当前活动中提供涵盖经济型e、通用算力型u1/u2i/u2a及第九代c9i/g9i/r9i的多规格云服务器,其中通用算力型u1以2核4G 5M配置199元/年续费同价锁定长期成本,u2i/u2a通过性能跃升40%与新用户3折起实现"加量降价",形成对经济型e实例的差异化优势。对比显示,u系列凭借企业级独享资源与高性价比,成为中小企业核心业务首选,而第九代实例则以顶尖算力支撑AI、高频交易等重负载场景,用户可结合业务需求、性能要求及预算选择适配规格。
|
12月前
|
人工智能 前端开发 程序员
AI工具普及,为什么很多人觉得编程难学?
产品专家三桥君深入探讨AI时代下编程学习的核心挑战,分析AI工具对编程的影响,并提出构建知识树的学习策略,帮助开发者高效掌握编程技能,提升竞争力。
420 0
|
Python
Polars实践(2):阿里天池——淘宝用户购物行为分析
Polars实践(2):阿里天池——淘宝用户购物行为分析
510 0
|
Java Spring API
Spring框架与GraphQL的史诗级碰撞:颠覆传统,重塑API开发的未来传奇!
【8月更文挑战第31天】《Spring框架与GraphQL:构建现代API》介绍了如何结合Spring框架与GraphQL构建高效、灵活的API。首先通过引入`spring-boot-starter-data-graphql`等依赖支持GraphQL,然后定义查询和类型,利用`@GraphQLQuery`等注解实现具体功能。Spring的依赖注入和事务管理进一步增强了GraphQL服务的能力。示例展示了从查询到突变的具体实现,证明了Spring与GraphQL结合的强大潜力,适合现代API设计与开发。
446 0
|
运维 架构师 微服务
谷粒商城:如何通过笔记复盘实现事半功倍?
该博客文章讨论了如何通过笔记复盘来提高学习和工作效率。
谷粒商城:如何通过笔记复盘实现事半功倍?
|
安全 JavaScript Java
[※]记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
[※]记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
2120 0
[※]记一次网站全站http升级为https的过程,websocket : ws升级为wss遇到的问题等
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp小程序的傣族节日及民间故事推广小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp小程序的傣族节日及民间故事推广小程序附带文章源码部署视频讲解等
154 0
|
存储 C++
链表操作:插入、删除与遍历
(笔者画图不易呜呜)链表是一种基本的数据结构,它可以用来存储一系列的元素,并且支持灵活的插入、删除操作。在计算机科学中,链表常常用于构建更复杂的数据结构,如栈、队列以及图等。
710 0