zoukankan      html  css  js  c++  java
  • FE-learning 前端学习

    github偶尔上不去,把学长给我们的学习资源转载在这里,同时记录下自己的学习感悟。

    Lesson 1:html 基本标签

    Lesson 2: html语义化 html4 html5 xhtml区别

    Lesson 3: html编码标准,百度教育页面html分析

    Lesson 4:http://www.w3.org/Style/LieBos2e/enter/ 

    http://www.w3.org/MarkUp/Guide/Style

    https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/What_is_CSS 要看完,不仅看what is css.

    3-5天完成设计稿,html+css

    之后照着w3c标准学习css大概一个月

    新收获:

    http://www.w3.org/Style/LieBos2e/enter/

    1."Gluing" Style Sheets to the Document: 4 methods

    2.in Chapter 15 , "Cascading and inheritance."   the designer's style sheet> user's>browser's default.    !important

    child node's own style has priority over style inherited from its parent.  

    equally specific, then CSS gives priority to the rule that is later in the stylesheet.

    3.Through inheritance, CSS property values set on one element will be transferred down the tree to its descendants.

    4.Overriding Inheritance :the order in which the rules were specified would determine which of them would win.

    5.there are Properties that don't inherit. like``` background property

    6.Common tasks with CSS.

    http://www.w3.org/MarkUp/Guide/Style

    自己平时不常用到的property

    1.First-line indent    p { text-indent: 2em; margin-top: 0; margin-bottom: 0; }

    2.Setting the font size in percentages relative to the size used for normal text:

    h1 { font-size: 200%; }

    3.Setting the font family:There is a short list of generic font names which are guaranteed to be available, so you are recommended to end your list with one of these: serif, sans-serif, cursive, fantasy, or monospace, for instance:
    body { font-family: Verdana, sans-serif; }

    4.Avoid problems with fonts and margins:

    (1)avoid text at the body level that isn't wrapped in a block level element such as p.

    (2)set the font family for pre elements, pre { font-family: monospace; } 有些浏览器忘了在设置字体大小或其他属性使用固定间距字体?

    (3)to set the font family on headings, p and ul elements if you intend to set borders or backgrounds on elements such as div. ?

    5.What about browsers that don't support CSS?

    • link for unvisited links
    • vlink for visited links
    • alink for the color used when you click the link

    The size attribute can be used to select the font size as a number from 1 to 6. If you place a - or + sign before the number it is interpreted as a relative value.<font size="+1" color="maroon" face="Garamond, Times New Roman">some text ...</font>

    https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/How_CSS_works

    1. DOM is where your CSS and the document's content meet up

    2.  # . tag selector  

    selector .key selects all elements that have the class name key

    selector [type='button'] selects all elements that have a type attribute with the value button

    Pseudo-classes selectors 

    selector:pseudo-class {
      property: value;
    }
    常用伪类,具体见 https://developer.mozilla.org/en-US/docs/Web/CSS/:not


    Calculating a selector's specificity (a,b,c,d)可以计算出具体数值

    Information: Selectors based on relationships

    Common selectors based on relationships
    Selector Selects
    A E Any E element that is a descendant of an A element (that is: a child, or a child of a child, etc.)
    A > E Any E element that is a child of an A element
    E:first-child Any E element that is the first child of its parent
    B + E Any E element that is the next sibling of a B element (that is: the next child of the same parent)

  • 相关阅读:
    tfs中如何创建团队项目及如何操作团队项目
    Qt出现常量有换行符的错误的解决方法
    .net程序在无.net环境下运行
    无法定位程序输入点__gxx_personality_v0的一个解决方法
    SQL Server2012中的SequenceNumber
    GDB十分钟教程
    使用vscode对c进行调试
    sqlserver 操作xml
    使用HttpOnly提升Cookie安全性
    SQL localdb 连接字符串
  • 原文地址:https://www.cnblogs.com/guozhiguoli/p/3697135.html
Copyright © 2011-2022 走看看