技术头条 - 一个快速在微博传播文章的方式     搜索本站
您现在的位置首页 --> 灵感_idea
    line-height 通常被我们用来干嘛呢? 比如:height:*px;line-height:*px;是这样的么?我们常常用它来对文字进行居中。为什么这样就能居中呢?因为行高是元素基线之间的距离,行高会减去字体的高度然后上下平分去建立一个行内框(inline box),如果这个时候高度和行高一致,自然就体现为居中。那么它有什么可研究之处呢?
    有人说html很简单,它甚至不被认为是一种真正的编程语言,当然还有另一个技术同样被类似的看待,它就是css。说实话,css的代码的确不复杂,如要要会简单的使用你只需要知道它是什么,然后任何一个人都能够轻松的用它来控制一个元素的宽高,内容字体的类型、大小、颜色等等。但它真的不只是一些规则。就像是同样认识字,会写字,但总有人能写出更好的文章一样。会用和科学的用,灵活的用仍然有距离。这篇文章来谈谈css中一些可能的最佳实践方法。
    性能,这个词如今被炒的很热,也是每个开发者,由“知道”、“会做”之后必经的一个“怎样做好”的阶段。性能关乎用户在不同设备和不同网络状态下的体验。也被多方面因素所影响。此文说说css方面怎样做到高性能。
    今天来聊聊图片,当然,对于web来说,图片是个大命题,多大呢?要多大有多大~这里只谈它是怎么“不听话的”,然后让它乖一点。 Web的世界里有很多问题,与之对应的基本也有很多情景和对策。那么问题就来了,我们遇到某种情景和找到的对策也都具有偶然性,下面来挑很多人都遇到过的一种情况说说。
     网页的历史不长,但是几经变化,不论是从布局,文字,颜色搭配,图标等等,都是有过诸多的演变,人们的审美不同了,或者说,一直在追求更美观的效果。 拿一些细节方面来说,比如渐变,圆角,阴影,半透明,这几个应该是被用的最多,效果也很好的方法。其中前三个,都可以做到比较好的退化,甚至说牺牲,因为很多时候,即使它们在一些浏览器里有,另一些浏览器里没有,看起来也能让人接受,不会产生太大的影响,半透明就不同了,透明和不透明的差别还是蛮大的,那么今天就来聊聊“透明”。 透明还分为两种,半透明的纯色 ,背景透明的图片。
    最近有朋友遇到了这个问题,然后他百思不得其解:我没有设置边距呀,这中间怎么有空隙呢?我一看便知它用了inline-block。或许你会问,这个问题应该知道的啊,比较平常的问题。好吧,在两种情况下这是不易察觉的。 一、设置了父元素背景而子元素没有背景 ; 二、子元素本身就设置了外边距,而且远比可能出现的空隙要大;
    Margin是什么? Margin这个概念本身并不难,我也不想把它说的多晦涩,会css的都知道box盒模型,它就是盒与盒之间的间距,俗称外边距,也有叫外补白的,这些不重要。是的,它就是这么简单,但是,它又是怎么兴风作浪的呢? 在刚接触css的时候,有个小师傅告诉我,能用padding的地方就不要用margin,容易出现问题,我当时是谨记在心,以至于后来在挺长一段时间,也不知道会有什么问题。人就习惯于用“有问题”来概括一个还没弄明白也没找到解决方案的问题,当然这是消极的,我们应该面对问题,解决问题。
    很多人把web标准挂在嘴边,却没有引起足够重视,只关注页面外在的表现而忽略页面本身代码的质量。 标准的页面具有哪些优点?
    今天为什么要谈这个呢?出于一个页面仔的“窥探”欲吧,也可能不是,因为这些本来就是需要知道的,只是可能没有引起太多人注意。 当然,每个“是什么”的背后都有一个“为什么”,很多人都遇到过“设置了z-index却无用“的问题。 z-index是干嘛的呢?——设置元素在z轴方向的层级。那么怎么用它才是正确滴捏?
    在我刚开始学习html的时候,几乎所有会的人都说最多一个星期就学会了。当我学习css到了一定阶段的时候,觉得也挺容易的呀,为什么有那么多人都做了那么久,还在那儿研究什么呢?与此同时,还有很多人去吐槽jquery,说它就是设计师玩儿的东西,前端敲代码的你应该去研究js以及各种框架诸如此类等等,反正你要让自己在搞的东西别人听了觉得高大上、不明觉厉就对了。这样的现象也不能说不好,因为毕竟还是在不断的学习,可是,不得不说也是浮躁的表现,高手用树叶都能杀人,你却一直只想要绝世好剑,在鄙视自己的道路上前进不止~问题是你也顺便鄙视了别人,呵呵。
    css3已经“出来”挺久了,由最初的新奇,尝试,到现在慢慢的被习以为常的应用,特别是移动端需求的暴增,对css3更好的支持,吸引更多的人走了进来,但是,对于刚开始接触它的人来说,或许会有很多的混沌之处,毕竟它是个大宝藏,而多数人因应用的局限,了解的面也相对局限。本文就试图给出一个稍大范围的概括性展现。当然,也只是一部分。 一谈起css3,多数人可能首先想到的是各种炫酷的效果。的确,css3的出现的确是使得css的世界有了焕然一新,被解放了的感觉。以前需要用图片的,需要多个标签进行堆叠的,需要用js的,需要用flash的等等,甚至是几乎想不到办法去做的东西,css3都给了我们相应的补偿。 但是,今天我不去从那些方面开始谈,我会按照某种分类把css3来个整体浏览。目的是让对css3不太了解的人能有个大概的了解,我自己也算是复习一下。另外,此文不会列出一堆代码给你看。
    html5的出现,让前端人员眼前一亮,大喊方便的同时,也空前重视标签使用的语义化,人们恨不得一下就去改变由div+css所带来满眼的div。新增的结构性标签有很多,比如header、nav、footer、aside、section、article等。 但有个问题令不少人犯难,前面的几个都还比较好理解,后面两个到底是什么意思呢,如果按照直译过来的意思。section:“部分”,article:“文章”。这显然无法很好的去区分,为什么呢,因为“部分”这个词儿,意思太模糊,“文章”里面也可以有“部分”,“部分”里面也可以有“文章”。权威指南里是这么进行说明的。 article:代表文档、页面或应用程序中独立的、完整的、可以独自被外界引用的内容。 section:用于对网站或应用程序中页面上的内容进行分块。
    话说大家不管用过没用过,对border-image应该都有所耳闻,相比css2.1,css3的新东西那么多,为什么要挑这个来说呢,因为我个人经验来说,这个相对来说较难理解。那它到底是什么,又怎么用呢,有哪些需要注意的地方?这方面也有书籍和文章讲,如果你看过,却觉得没搞懂,也没弄明白怎么回事,那么希望这篇文章可以帮到你!我不会按常理出牌~ 首先要跟大家说的是,不要先入为主的走入一个死胡同,不然很难走出来,图片边框,跟使用线型边框的时候不一样,这个思维要转换过来,使用线型边框的时候,你只需要设置“边框宽度”、“类型”和“颜色”。那么边框就出来了,使用图片的时候你可不能照搬,它有自己的一套规则,所以,请清空你的脑袋,忘却才能更好的学习(这话好像在武侠片里比较常用)~
    先说两句闲话,为什么叫再谈呢?因为以前有谈过,请看这里初谈css博客搬过家,请忽略发表时间~ 时间差不多是一年前,那个时候还没有换工作,公司就我一个前端,负责一个项目的所有前端相关,当然,说是这样说,我是没有能力去顾及那么多的,自己懂的或者意识到的东西本身就有限,只是通过一整个项目的折腾,总会意识到一些问题,甚至有时候代码写得自己都忍无可忍,有痛就有领悟,自然就能总结出一些东西,就有了那篇初谈。当时写完之后蛮有成就感的,现在看来还是有很多不足,因为是初谈,为照顾一些初学者,包含了多一些基础的东西,一年过去了,前段时间在团队内部也做了一次css的分享,借此机会再谈谈吧,虽然依旧可能有很多不足~选择器
    我是个什么都谈不上的不合格的前端~但还算是个有点追求、不断前进的前端,我希望自己的代码更合理、更高效、更优美。为了照顾一下基础稍微薄弱一些的人,我会从浅到深的逐步去说这个事儿。 学习前端技术,基本上都要从html、css、js这么一条线走过来,那么最先写的就是html了,没有结构和内容,网页就是一片空白,就无从谈起它长什么样子(css),初学时,不会去写整个页面,而是从一个个能实现效果的小例子去写,每当这些小例子乖乖的呈现在网页中的时候,新童鞋都会兴奋异常是吧~什么各种粗体的,斜体的,居中的,大小写字母的,换行的,水平线,跑马灯的,背景音乐的,都想去试试(其实都差不多~),到后来可能会知道这样不好是吧,不符合结构和表现分离的原则。
    定宽居中我们见的很多,可以用width、text-align、margin等来实现,但是如果没有宽度呢? 下面提供几种思路供大家参考,给出基本的html结构和思路,当然了,也不一定是这样的结构,道理搞懂了相信大家能够灵活变通。另外,里面的项是有固定宽和高的。
    这个话题由我来说可能不是最合适的,论资历和认识,我不如那些征战多年的行业前辈们,但是我想做的事情,请别人花时间和精力来做,觉得不大合适,我也愿意写这么一篇文来分享一些关于网页布局最基本的东西。这篇文会有两个特点: 一、不会有“深刻认识”、“揭秘”之类的出现,因为本来就没有;不会有很厉害或者通用的布局方案告诉大家,不是本文重点;也不会时不时把标准搬出来,只会直观的简要描述。 二、会带有一定的故事情节,我相信前端们都有着相似的经历,沿着故事的发展路线,或许你会产生更多的共鸣。 换句简单的话说就是:更适合初学者看~
    人人都更加愿意谈自己擅长的新东西,好玩的东西,高级的东西,某种技巧等,我为什么写这么一篇文来告诉大家自己做过的矬事呢?每个人都是从无知到有知,从做得差到做得好,很多人会觉得自己在某个时候进入了一种瓶颈,其实就是没有对比,没有去接触更好,更广阔的东西,没有跟外界有足够的交流,就比较难发现自身的不足,勇于去主动发现自己的不足,总结思考,加以改进,就能从中学到东西,得到提升。我写到的这些东西,应该也有很多人同样遇到过,大家的经历应该都是相似的,所以,希望能够起到一定的参考作用。
[ 共18篇文章 ][ 第1页/共1页 ][ 1 ]
© 2009 - 2024 by blogread.cn 微博:@IT技术博客大学习

京ICP备15002552号-1