• 仔细学习CSS(一)


    推荐编辑器:Notepad (under Windows), TextEdit (on the Mac) or KEdit (under KDE);

    Style Master, Dreamweaver or GoLive

    For HTML and CSS, we want simple, plain text files.

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
    DOCTYPE means DOCument TYPE
    Between <head> and </head> there is room for various kinds of information that is not shown on screen.
    <body>里的就是用来显示的了~

    '2em' means 2 times the size of the current font.

    什么是CSS及使用的好处:

    cascading Style Sheet:层叠样式表

    控制网页样式、能将样式信息与网页内容分离的、一种标记性语言。

    不需要编译,由浏览器执行。为浏览器解释型语言。

    作用于:页面布局、字体、颜色、背景、特效等。

    相关组织和历史:

    1994提出、1996年浏览器支持、W3C(world wide web consortium)的CSS组。

    1996、CSS1;

    1998、CSS2;目前是CSS2.1;

    CSS3 已经开始应用了~

    可用于多种设备:手机、电视、打印机、幻灯片等。

    比传统HTML的优势(内容老啦,可忽视):控制、排版(对应:html的标记);

      提高网页浏览速度:table全加载完显示?css加载点显示点?

      可维护性、易维护性、SEO等。

    CSS基本语法:

      a{font-size:12px;font-family:"Microsoft Yahei";display:inline-block;} 

      .last{}/*类选择符*/

      #last{} /*ID选择符,局限性很大。我个人不喜欢在html结构中使用id。*/

      H1, H2, H3 { font-style: bold }/*合并多个selector*/

      CSS1 定义了50种。  CSS2 在CSS1的基础上增加了70种,定义了大概120种属性。

    HTML里使用CSS的方式,一般四种:

    1. 直接写在标签里。

    <span style="display:block;height:20px;">我不喜欢这样写。不建议。</span>

    2. 在header头里加一段css代码。

    <style type="text/css">/*MIME类型,浏览器不支持CSS,则会过滤掉。一般不建议。*/

      li{list-style-type:none;} 

    </style>

    3. 在header头引入一个css文件。一般都用这种方式。

    <link rel="stylesheet" type="text/css" href="./t1.css">

    4. @import 引入。

    浏览器和CSS:

      兼容性问题;

      是否支持CSS。<style type="text/css"></style>(现在)| <!--注释-->(过去)

      <style type="text/css"></style> 告知浏览器引入文件的类型,支持也读文件,不支持忽视之。

    树结构与继承:

      子节点通用样式可以放在父节点写,(代码重构)样式预设;

      也增加了可读性。(书写规范)

    重写:

      能够重写是因为:更具有指向性。更具体。

              与顺序无关!?

    不是所有的属性都可继承!

      比方说:background...

      你在body上写个background,再看它的子节点,你会发现。。

      why?

        There are two reasons: first, transparent backgrounds are faster to display (there is nothing to display!) than other ­backgrounds.

        元素背景默认为 transparent。

        Second, since background images are aligned relative to the element they belong to, you would otherwise not always end up with a smooth background surface.

      Tips:如果background 属性存在时,记得增设一个 color 值。确保文字和背景不一致~?

    问题:需要研究下CSS的继承性~对于每个属性的继承性~

  • 相关阅读:
    php模拟http请求的方法
    快递100接口开发
    live555从RTSP服务器读取数据到使用接收到的数据流程分析
    VLC源码分析知识总结
    VLC播放器架构剖析
    Android Audio System 之一:AudioTrack如何与AudioFlinger
    VLC各个Module模块之间共享变量的实现方法
    流媒体开发之--HLS--M3U8解析(2): HLS草案
    M3U8格式讲解及实际应用分析
    通用线程:POSIX 线程详解,第 3 部分 条件互斥量(pthread_cond_t)
  • 原文地址:https://www.cnblogs.com/hanyuxinting/p/4092722.html
Copyright © 2020-2023  润新知