首页 > 教程 > 关键词  > 常用技巧最新资讯  > 正文

前端开发中一些常用技巧总结

2010-07-15 17:33 · 稿源:Mr.Think,mrthink.net/css-common-summary/

原文发布于Mr.Think的博客: https://mrthink.net/css-common-summary/

自己前端开发中常用到的一些技巧及问题解决方法,会常更新,希望对前端路上的朋友有帮助。

1、文章标题列表中日期居右显示的方法(提供了两种方法,使用时视情况而定):

方法一:本版2楼思路(感谢~),耗资源比较少,多两句代码。

代码:

<p>@Mr.Think这是文章标题<span>2010-10-10</span></p>
CSS定义:

代码:

p{position:relative}
p span{position:absolute; right:0}

方法二:代码相对方法一少,但比较耗资源

代码:

<p><span>2010-10-10</span>@Mr.Think这是文章标题</p>

然后定义span右浮动:

代码:

p span{float:right}

其实这种方法可以延伸到很多情况下,很实用的一种写法:

2、web标准中,同一页面中只能有一个h1标签。很多人知道这个概念,但做到的却很少;

3、空白外边距互相叠加的问题:一般通过添加透明边框或者1px的内边距避免。详细解读: https://mrthink.net/css-margin-overlying-way/;

4、ie6下max/min-width/height实现,_width: expression(this.width >600 ? “600px” : true);,height同理。

5、html/class/id,最好统一以小写书写,这样更严谨(符合xhtml标准):

6、不推荐用下面代码兼容IE8:

代码:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

如果是非短期性页面,尽量避免使用,页面应尽可能保证向后兼容;

7、空div在IE(FF中没有)是有默认高度的,可以用定义:div { witdh:100%;background:#9c0; ling-height:0}的方式去掉默认高度;

8、在使用table标签时应该尽可能的利用它本身的属性,最大限度的分离结构与样式。详细解读:https://mrthink.net/csshtml-colgroup-col-style/;

举报

  • 相关推荐
  • 苹果发布iOS 18.6开发者预览版Beta 3:国行AI遥遥无期

    今日,苹果向iPhone用户推送了iOS 18.6开发者预览版Beta 3。 开发者可在兼容设备上通过设置”应用,进入通用软件更新”下载该测试版。 目前尚未发现有可见更新内容,不过此前有消息称,iOS 18.6将会针对欧盟地区用户进行实用性更新。 苹果当前在欧盟地区的iOS版本虽然支持上述两种行为,但会插入一些警告屏幕,这引起了欧盟监管机构的关注,将会进行一些调整。 值得注意�

  • 融合数据中台与动态调度:林剑峰在共享出行智能算法开发中的技术探索

    本文讲述了林剑峰在智能出行领域的十年深耕历程。作为系统工程师,他主导构建了融合数据、算法与规则引擎的智能调度体系,通过动态聚类和路径规划模型显著提升了共享单车调度效率。其创新包括分级围栏模型、嵌入式调度判断模块等专利技术,实现了跨区域精准调度和系统自主运行能力。数据显示,他推动的系统使车辆调度效率提升37.38%,异常识别准确率显著提高。林剑峰的工作体现了"技术+业务"的系统设计理念,为城市智能交通建设提供了可借鉴的技术范式。

  • 王思聪的110万元电视坏了上热搜 更换其中一块模组即可

    ​近日,王思聪位于日本家中的一台价值110万元的三星电视出现故障。此前,电丸科技凭借对MicroLED显示技术的深入研究,促成了王思聪购入这台110寸的高端电视。此次电视出现坏点问题后,电丸科技迅速响应,携手三星工程师一同奔赴日本,为王思聪提供售后服务。 据了解,这台MicroLED电视构造独特,由192块模组拼接而成,即哪块模组出现故障,直接进行替换即可。抵达现�

  • 华为回应《原神》鸿蒙版何时上线:正进行鸿蒙5的开发适配

    日前,华为终端BGCEO何刚微博发文,称鸿蒙5上架了很多游戏,我也要下载体验一下。 有网友在评论区留言询问:《原神》啥时候上线? 对此,华为终端客户服务表示,华为正与应用开发者进行HarmonyOS 5的开发适配与技术沟通工作,因体量、功能差异不同功能的适配周期和进度不同,可以尝试在应用市场我的心愿单中添加心愿。 一旦应用上架,应用市场将会第一时间通过通知

  • 折叠iPhone已进入P1原型开发阶段:2026年见

    苹果公司正在推进可折叠iPhone的研发进程,预计这款创新产品将在2026年下半年正式亮相。 据海外媒体报道,苹果的折叠iPhone项目已于6月进入P1原型开发阶段,随后还将经历P2和P3阶段,预计2025年底完成整个原型开发流程。 根据天风国际分析师郭明錤透露,鸿海精密将在2025年第三或第四季度开始生产这款折叠屏幕iPhone,尽管关键的转轴部分尚未最终确定,但屏幕规格已定,将

  • 十年iOS老将的鸿蒙征途,京东支付冯笑的开发实战录

    京东支付资深开发者冯笑在iOS开发领域深耕十年后,积极拥抱鸿蒙生态转型。他带领团队从零构建京东支付SDK鸿蒙版本,克服了二维码生成、页面路由等技术难题,通过与华为团队紧密合作解决系统初期功能不完善的问题。冯笑指出鸿蒙与iOS在声明式UI、组件化开发等方面有共性,但鸿蒙更强调万物互联和设备协同。他建议开发者转变思维模式,从命令式转向声明式编程,通过官方文档学习和实践项目快速掌握鸿蒙开发。冯笑团队目前双线作战,既维护成熟的iOS支付功能,又持续推进鸿蒙端功能对齐和技术沉淀,为鸿蒙生态繁荣贡献力量。

  • GCDG丨江阴站:AI赋能,开发者技术沙龙圆满举办!

    2025年6月8日,葡萄城开发者社区在江苏举办"AI赋能·开发者技术交流会"。活动汇聚多地开发者,共同探讨AI+低代码创新实践。开发者谷凯展示如何利用GPT-4等AI工具提升开发效率,强调独立开发者"一人也能创造价值"的理念。钟代冬分享家纺电商低代码工程案例,展示活字格平台实现复杂任务自动化运维的能力。技术顾问薛禹坤介绍"All-in-One一站式智能体开发"理念,演示活字格V11.0新版本AI功能。活动促进跨地域、跨领域思维碰撞,为开发者搭建紧密连接平台,推动前沿技术交流与实践经验分享。

  • 前端开发 20 年变迁史

    1990 年,第一个Web浏览器诞生,而WWW的诞生直接拉开前端史的序幕。从静态页面到JavaScript,从依赖后端到自主开发,前端开发者从不被重视的“页面仔”逆袭为如今很多前端工程师的薪资比后端还高,从前端技术由国外开发者主导到如今国内自主产生的小程序技术,我们走了 20 年。

  • 音乐弹幕、AI美音、音色测试…..回森携音乐黑科技亮相华为开发者大会2025

    快手旗下Z时代音乐K歌社区APP回森受邀参加华为开发者大会2025,展示AI技术在音乐领域的创新应用。该平台通过多项首创技术降低音乐创作门槛,推出"音乐弹幕"等互动玩法,并与鸿蒙生态深度合作,实现音频自动对齐、AI美音等功能升级。其中,音乐弹幕功能让用户长按即可录制20秒合唱片段,结合多轨混音技术实现高质量"云合唱";AI美音功能则通过生成式技术

  • web前端开发工程师, 你应该了解的几点SEO知识!

    一名优秀的web前端开发工程师,对于公司而言是非常难得的珍宝,他往往在很大角度上影响公司的销售业绩,他们的薪资也相对很高,一般来讲web前端开发工程师,需要了解CSS、HTML、SEO、DOM、BOM、Ajax、JavaScript等相关知识,其中蝙蝠侠IT认为,SEO仍然是很重要的一部分,原因很简单:在完美的页面,如果没有欣赏它的渠道,也只能是自娱自乐!