厦门网站建设_避免CSS坏位

2018.03.30 |
标签

厦门网站建设_避免CSS坏位



厦门网站建设越使用CSS,我越来越觉得这是一个绝对的狂野西部。这是成熟的,无处不在的,但缺乏基本的、常识的特点,是一种在其他类似的工具。一些现代的MVC Web应用程序有良好架构的后端工作后,广泛的测试覆盖率和良好的文档,我经常发现有巨大的冒着热气的意大利面垃圾样式表。


我可能是不公平的。它在出生的时候网络还在发展,创意被扔和流行的开始坚持。


难以相信的CSS,在世界的每一个网站都需要它,不能没有它。这里是我的一些思考什么是差的,如何保持清醒的时候写的呢。这将是一个工作表,所以任何错误我在未来会上涨到年底。


1.全球范围


我用CSS第一和最大的疑虑,就是任何样式声明可以改变网页上的任何元素的任何方面。如果你刚刚开始你的脚趾浸到Web这是超级强大的,伟大的,但更大的网站,往往不是,这是很危险的。几乎所有的前端开发人员在他们职业生涯的一点添加/更新/删除一个风格,却发现意外泄漏到另一页的其他部分。


我想这是CSS最重要的问题。它使任何概念的模块化非常困难。明天一个开发商能坚持几!important标签和废你的很好的封装,可重复使用的部件。


.blog-post {

  .title {

    font-size: 2rem;

  }

}

 

# Grrrr, styles leaking everywhere

h1 {

  font-size: 5rem !important;

}

SASS /标准有助于我们这里,但不完全。如果你是一个好一点的开发,然后漏款式可由父类中的嵌套规则明显减少。

.blog-post {

  .title {

    font-size: 2rem;

  }

}

 

# A bit better

.home {

  h1 {

    font-size: 5rem;

  }

}


这是更好的,但它不是一个万无一失的解决方案。只需要一个粗心的方式带你回到泄漏地狱。一个紧的最后期限迫使你做出一些妥协(即黑客)。


如果你告诉任何后端开发者,他们使用的编程语言使所有变量的全局范围,使每一个对象的内部状态可见,让其他开发者重写他们的代码,他们可能会当场辞职。但这是CSS开发的疯狂的现实。一切都待价而沽。不变性吗?


厦门网站建设


厦门网站建设最好的解决方法


最好的方法在全球范围内,我遇到的是采用CSS命名系统,边界元法,预计开发商一直写在一个模块化的方式代码。它避开危险的漏习惯使用标签(如造型h1P,等)而更喜欢造型类名称。这是故意的命名空间的模块类的名字(或块边界元法中的术语),他们生活在,以避免类似的意外碰撞类的名字。


经常有一种观点使用标签来创建一组默认样式。对于大多数网站,它通常是一个好主意。然而,如果你只是重写这些风格几乎无处不在,我想说,不要打扰。把它们放在通用的工具类(如.paragraphheading-1,等)和使用它们作为你的需要。


边界元法是不完美的。它可以是繁重的写作大,长,使用命名空间的类都。你还在写CSS。你还可以写狡猾的风格,把一切都搞砸了。你还需要纪律。但它确实给结构、一套规则,将帮助你写出更好的、更易于维护的方式。


2.厦门网站建设specificity


特异性是使用CSS来决定哪个款式是比其他的更重要的机制。在我的经验中,它几乎总是结束在一个竞底(或在这种情况下的顶部)。一把的!important标签,任意ID和不需要的款式DIV包装的目的是将特异性比现有风格高一点麻烦。真实的故事。


如果你让一个新的UI元素,但另一个非常具体的方式通过你的同事写的是站在你的方式,你会:


花时间了解你的同事的UI部件,找出一个变化的风格到网站的其它部分的影响,相应的重构。


这取决于你的工作环境中,你的代码库的大小,你的选择可能会有所不同。


面向对象语言解决这个问题通过继承和子类。最重要的具体方法是在继承树的顶端,在最底层的具体。在我看来,这些原则应用面向对象领域中的UI的工作比CSS的特异性更好。熟悉iOSUIKit例如将熟悉通用UIView部件和更具体的子类重写某些属性。另一方面,你通常要写更多的代码和花更多的思想对这种替代行为。


最好的解决方法


不参加比赛的底部。在一般情况下,确保你的风格不太具体。


尽量不使用!important(有时候你不得不工作时与第三方嵌入)。


不要风格对IDS(特定的)。


使用类的名字(unspecific)。


避免包括方式选择器后代这些能提高特异性。公司/组合、嵌套方式编译到后代选择器,所以别窝。


如果你使用边界元法,你已经遵循这些规则。



1522398503752439.jpg


3.厦门网站建设隐式比例规则


任何人谁使用的比例填充规则之前会意识到困惑的事情可以得到。


.sidebar {

  padding: 10%;

}

如果你是新的CSS,上述方式可能会让你停下来想一想。目前还不清楚怎样去做10%10%是什么?这可能是对的

视口的宽度

视口高度

宽度的.sidebar

高度的.sidebar

家长的宽度.sidebar

家长的高度.sidebar

完全不清楚它的脸。事实上,它会计算百分比使用父元素的宽度。这给一些直观的结果,如垂直填充时改变浏览器宽度的变化而不是高度(顺便说一句,这都是常用的破解部分反应率)。这也意味着,如果你想你的垂直填充回应你的容器的高度,你就不能。


在理想的世界里,每当你使用一个百分比,你应该明确地指定它应该对应什么样的价值。我认为这是合理的期望。


厦门网站建设公司


4.厦门网站建设最好的解决方法


有没有很多你可以绕过这个不幸的。


如果你想事情的大小相对于视口视口的宽度和高度,那么我建议你使用vwVH单位。这个支持很好,你不必小题大做周围的百分比。小心特点移动视口的宽度和高度可以改变取决于如果浏览器显示。


在解决隐比例问题而言,我认为加入单位的方法vwVH是一个很好的解决方案。我只是希望他们走远一点。


5.厦门网站建设Z指数


Z指数是引起头痛,常见的解决方法,核,是:z-index: 999999。一旦这种情况发生,随之而来的混乱。任何需要出现在它在未来很可能会包括一个额外的

我想这一切开始向下走由于缺乏上下文的山。因为Z-INDEX规则分别指定所有样式,它们之间的关系还不清楚。

最好的解决方法

如果我们遵守纪律,SASS /标准可以帮助我们在这里。我们所有的z-indexes定义为变量一起为我们提供了我们所需要的背景。

$z-index-page: 100;

$z-index-navigation: 200;

$z-index-newsletter-modal: 300;

我们可以清楚地看到我们的通讯模式超出了我们的导航,越过我们的网页内容。

我也倾向于工作,所以我们可以等z-indexes数百槽之间如果我们需要。这不那么重要如果每个集中存储和上面一样,因为你可以很容易地更新所有的值只在一个地方。


6.厦门网站建设你必须使用它


JavaScriptCSS的浏览器的事实上的语言。这是设计网页的唯一选择,所以必须接受,疣和所有。希望有一天会成为浏览器语言无关。总有一天。

另一方面,CSS在不同的平台上都能正常使用,而不是iOSAndroid和其他技术生态系统的围墙花园。


转载请注明:厦门网站建设http://www.mfadj.com/newsshow-64.html

相关推荐

陕西网站建设中关于企业网站方案策划书的基本原则
陕西网站建设 

陕西网站建设中关于企业网站方案策划书的基本原则

在企业网站建设前,每个站长都会做一份有关于企业网站方案策划书。但是会有不少的重复困难会遇到。那是因为很多站长在企业网站方案策划书没有遵循一些基本原则,所以很多站长对于企业网站方案策划书还是会有疑问,那么今天陕西网站建设的小编就来给你们讲解一下关于企业网站方案策划书的几个基本原则。
2018.01.22
内蒙古网站:专业网页设计必须注意的几个问题
内蒙古网站 

内蒙古网站:专业网页设计必须注意的几个问题

随着互联网的时代到来,网民们对于网站要求也越来越高,那么对于网页设计师来说的压力也越来越大,这个是毋庸置疑的。今天内蒙古网站的小编来给你们分享一下专业网页设计应中必须要注意的几个问题。希望对于网页设计师们有所帮助。
2018.01.22
厦门网站制作教你手机移动网站制作后优化的5个秘籍!
厦门网站制作 

厦门网站制作教你手机移动网站制作后优化的5个秘籍!

在这移动互联网时代,一个网站没有适配上手机版,你会发现手机访问网站的时候是惨不忍睹的,而从数据上很可能也会让你震惊,两个同是厦门网站制作的资讯网站,有适配手机版的网站手机流量占比77%,没有适配手机版的网站手机流量占比仅为14%,自己都被这发现给震惊了。
2018.03.23
厦门网站制作教你怎么制作一个成功的网站
厦门网站制作 

厦门网站制作教你怎么制作一个成功的网站

厦门网站制作和权重不是一回服务器的加载速度一定要有保证,这样网站的运行才会稳定。如果条件允许的话,可以使用独立服务器。事吗?网站制作的质量好坏不是权重高低的象征。但,网站制作公司制作网站的质量是网站权重好坏的前提,也就是说制作网站的时候充分考虑到网站后期优化,那么,网站后期权重建设就有了好的铺垫,优化效果也会容易实现一些。
2018.03.23
厦门网站设计教你怎么设计打造一个成功的企业网站
厦门网站设计 

厦门网站设计教你怎么设计打造一个成功的企业网站

厦门网站设计教你怎么设计打造一个成功的企业网站: 1、宣扬推广公司本身品牌。 经过官网,公司可向外宣扬公司的文明、公司的概略、商品、效劳质量以及新闻等内容。发布在厦门网站设计官网上的信息能够制作得较为详尽,包含商品的各种性能参数,运用说明等;使用图文声像并茂的页面宣传公司。 在宣传公司的一起,愈加宣传了厦门网站设计公司的商品,使其页面上的商品信息愈加方便地传到达方针客户群,树立网站前的公司,商品出售途径受到了很大的约束,树立网站后,取得了更大的客户集体,为公司的商品走向世界打下了坚实的根底,然后不断进步商品的品牌形象。
2018.03.23
网页设计大气就是说网页设计一定要简约.
 

网页设计大气就是说网页设计一定要简约.

网站设计中气氛的意义是指简洁的气氛。主要内容应适当夸大,次要内容不要干扰,只需内容布局和色彩搭配,页面只需形成视觉焦点,停留在气、网页上下左右即可,同时功能又通畅透气。而不是那种你想放在一页上的东西。
2018.04.14

最新文章

高端大气网站建设:新手建设网站需要考虑的几个问题
 

高端大气网站建设:新手建设网站需要考虑的几个问题

在当今的互联网上,它是否像一场烈火、个人网站或企业网站,甚至是专业的行业门户,经过几年的沉淀和发展,不再是一个简单的网站建设,高端大气网站建设,需要更多的营销效果。行业内,企业纷纷从线上走线,开始关注电子商务,因此对网站营销提出了更高的要求。
2018.06.21
门户网站建设流程:学习web前端开发能做哪些工作
 

门户网站建设流程:学习web前端开发能做哪些工作

我们称之为网络前端的网页设计师,在几年前的网站制作中,随着网站的各种功能的不断变化,网页设计师简单地调用已经无法体现出帖子的所有功能。毕竟,除了网页设计、网页外,这个帖子也是如此。赋予了许多其他功能,门户网站建设流程,所以为了更好地执行这个位置的定位,Web前端开发工程师将因此而出现。
2018.06.21
厦门英文网站设计:设计网站需要了解的五件事
 

厦门英文网站设计:设计网站需要了解的五件事

站长注意到了吗网站建设前需要知道的五件事!在互联网上,有越来越多的人在做网站。甚至有些人手上有上百个站点,网站种类太多,但有些网站赚了钱,有些朋友为了个人利益而写博客,朋友为了公益或实现梦想。也许我说的有点大,是STA的原因。厦门英文网站设计,但是我相信站长是充满激情的,并且有点兴奋地开始自己的个人网站。但是,建立一个好的网站需要长期的努力和努力,下面将介绍站前应该知道的5件事,让大家知道。未来的NE可能会提前出现在各种条件下,记下。
2018.06.20
厦门英文网站制作:网站建设前应把握的4个要点
 

厦门英文网站制作:网站建设前应把握的4个要点

在制作企业网站之前,我们需要知道哪些问题很多企业看到行业竞争对手都有一个网站,他们会觉得自己应该建一个网站,然后盲目地跟着网站,甚至怎么做自己的网站也不知道,这是很不好的。作为一个回响网络,厦门英文网站制作,下面4个问题一定要想清楚。首先企业做网站。
2018.06.20

热门推荐

选择您希望厦门网站设计成品的风格偏好,让我们通过精确的分析与筛选,为您推荐合适的版式布局,
为此,您可以节省最基本的沟通时间,
让我们把有限的时间,充分的用在对行业的分析及您企业网站建设的自身分析上吧