• 《编写高质量代码:Web 前端开发修炼之道》 笔记与读后感


    编写高质量代码:Web 前端开发修炼之道/曹刘阳著. —北京:机械工业出版社,2010.5 第一版

    涉及到的知识点

    1. CSS Sprites 在国内很多人叫css精灵,是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去,这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言,不高于200KB的单张图片的所需载入时间基本是差不多的,所以无需顾忌这个问题。

     2. border-collapse 属性设置表格的边框是否被合并为一个单一的边框

    描述
    separate 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
    collapse 如果可能,边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。
    inherit 规定应该从父元素继承 border-collapse 属性的值。

    3.:after 选择器在被选元素的内容后面插入内容。http://www.w3school.com.cn/tiy/t.asp?f=css_sel_after_style

    请使用 content 属性来指定要插入的内容。

    p:after
    { 
    content:"台词:-";
    background-color:yellow;
    color:red;
    font-weight:bold;
    }

     4. zoom版本:IE5.5+专有属性 继承性:  

    zoom : normal | number 
     参数:
    normal :  使用对象的实际尺寸
    number :  百分数|无符号浮点实数。浮点实数值为1.0或百分数为100%时相当于此属性的normal值
    说明:设置或检索对象的缩放比例。
     示例:http://www.divcss5.com/shouce/c_zoom.shtml
    div {zoom : 0.75; } 
     
    5.

    widget 英[ˈwɪdʒɪt]
    美[ˈwɪdʒɪt]
    n. 小器具,装饰品,窗口小部件;
    [例句]The secret is a little widget in the can.
    奥秘在于易拉罐中的一个小玩意儿。

    overlay 英[ˌəʊvəˈleɪ]
    美[ˌoʊvərˈleɪ]
    v. 覆盖; 镀金;
    n. 覆盖物; 轮廓纸;
    [例句]The floor was overlaid with rugs of oriental design.
    地板上铺着东方风情的地毯。

    stacked 英[stækt]
    美[stækt]
    v. 堆积( stack的过去式和过去分词 );
    [例句]They are stacked neatly in piles of three.
    它们每3个一组被整齐地码放在一起。

    6.

    <style type=”text/CSS”>
    span{font-size:40px}
    .test2{color:green}
    .test{color:red}//覆盖前边的,显示红色
    </style>
    <span class=”test test2”>1234567890</span>

    <style type=”text/CSS”>
    span{font-size:40px}
    .test2{color:green}
    .test{color:red}//覆盖前边的,显示红色
    </style>
    <span class=”test2 test”>1234567890</span>

    根据类在css中定义的位置,后边的覆盖前边的

    另外,HTML标签的权重是1,如p。class的权重是10,如.test。id的权重是100,如#id。权重总合越大,越不容易被覆盖。

     7.DTD全程Document Type Definition, 即文档类型定义。DTD是一种保证HTML文档格式正确的有效方法,可以通过比较HTML文档和DTD文件来看文档是否符合规范, 以及元素和标签使用是否正确。一个DTD文档包含元素的定义规则,元素可使用的属性,可使用的实体或符号规则。

     8.

    cite 英[saɪt]

    美[saɪt]
    vt. 引用,引证; [法] 传讯; 表扬; [军事] 传(或通)令嘉奖;
    n. <口>例证,引文;


    acronym 英[ˈækrənɪm]
    美['ækrənɪm]
    n. 首字母缩略词;

    9.块级元素可以设置width、height属性。而行内元素设置width、height属性无效。

    但奇怪的是,行内元素水平的padding-left、padding-right、margin-left、margin-right都能产生边距效果。而竖直方向的却不会产生边距效果。

    我们可以通过修改display属性来切换块级元素和行内元素,如block或inline。

    感想

    如果让我就这个主题写一本书,我会写点什么呢?也许很少吧,也许无从下手吧。所以,多看书吧,满足一下自己的求知欲。

  • 相关阅读:
    S1 商品信息管理系统
    用例图
    mvc使用mongodb时objectId序列化与反序列化
    windows下检測文件改变
    【Android 开发实例】时间管理APP开发之数据库设计
    设计模式 之 原型
    ANT安装及配置
    Java环境变量设置
    Win7安装软件,界面上中文显示乱码的解决方案
    Some perl tips
  • 原文地址:https://www.cnblogs.com/dyh-air/p/7670584.html
Copyright © 2020-2023  润新知