1. 一、简答
    1、手写html模板，并解释模板每个标签的作用
       <!doctype html> 文件类型html
       <html>页面根
          <head>后勤内容
             <meta charset="utf-8" >元素字符编码
             <title>first page</title>标题
          </head>
          <body>显示内容
          </body>
       </html>
  2.  
  3. 2、html三个组成部分，并分别举两个案例
        # 标签: h1  a
       # 指令: !doctype  <!-- -->
       # 转义字符: .class$p1  color:#FFF
  4.  
  5. 3、解释一下什么是标签，为什么用标签
        一个网页可以没有样式，可以没有交互，但是必须要有网页需要呈现的内容，
        而HTML作为一门标记语言，是通过各种各样的标签来标记网页内容的，
        所以HTML部分是整个前端的基础，我们学习HTML主要就是学习的HTML标签。
     那什么是标签呢？
        #1、在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来，如`<html>`、`<head>`、`<body>`都是标签，
        #2. HTML中标签通常情况下是成对出现的，分为开始标签和结束标签，
            结束标签比开始标签多了一个`/`，开始标签和结束标签之间的就是标签的内容。
        #3、有些标签功能比较简单，使用一个标签即可，这种标签叫做自闭和标签，例如:<br/> <hr/> <input/> <img/>
  6.  
  7. 4、分别书写五个已上单标签、双标签，并解释一下为什么要设置单双标签
    - 单标签：单标签在自身标签标识结束，主要应用场景为功能性标签
    a img br hr link
    - 双标签：双标签有成对的结束标识，主要应用场景为内容性标签
    div h1 ul li p
  8.  
  9. 5、列举三个组合标签
    table>tr>th+td
    form>input
    ul>li
  10.  
  11. 6、简述css的引入方式，并简单解释各种的优点
    行内式:简单直接,针对性强
    内联式:解耦合了,可读性强
    外联式:适合团队高效率开发, 耦合性低, 复用性强
  12.  
  13. 7、简述什么是css选择器，为什么要使用css选择器
    要使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。
    HTML页面中的元素就是通过CSS选择器进行控制的。
  14.  
  15. 每一条css样式定义由两部分组成，形式如下： [code] 选择器{样式} [/code] 在{}之前的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素
  16.  
  17. 8、列举三个基础选择器，css语法分别是什么，并分析优先级
    通配选择器
    * {
        border: solid;
    }
    标签选择器
    div {
  18.  
  19. }
    类选择器
    .red {
        color: red;
    }
    id选择器
    #div {
        text-align: center;
    }
    - 基础选择器优先级大致与选择器匹配范围成反比，匹配范围越小，优先级越高
    - 基础选择器优先级大致与选择器匹配精度成正比，匹配精度越高，优先级越高
    - 基础选择器优先级：id选择器 > 类选择器 > 标签选择器 > 通配选择器
  20.  
  21. 9、简单列举长度单位
    CSS相对长度单位  说明
        em 元素的字体高度The height of the element's font
        ex 字母x的高度The height of the letter "x"
        px 像素Pixels
        %  百分比Percentage
  22.  
  23. CSS绝对长度单位  说明
        in 英寸Inches (1 英寸 = 2.54 厘米)
        cm 厘米Centimeters
        mm 毫米Millimeters
        pt 点Points (1点 = 1/72英寸)
        pc 皮卡Picas (1 皮卡 = 12 点)
  24.  
  25. 10、说出至少两种颜色表示方式
    第一种表示法使为直接写颜色的英文，例如：blue
    第二种表示方法为用黄色，绿色，蓝色的值设定color的值。例如：rgb（204,213,9）
    第三种表示方法为第四种表示方法是使用颜色的十六进制值设定color的值；十六进制颜色表示以#开头 0123456789abcdef 分别表示0~16的数字,#后面第一二位数字
    表示红色的值，三四位数字表示绿色的值，最后两位数字表示蓝色的值，例 ：#cc0066
  26.  
  27. 11、如何综合设置文本样式：字重900、大小30px、行高100px、字族"STSong"
    /*字重 风格 大小/行高 字族  (风格可以省略) ***** */
            font: 100 normal 60px/200px "STSong", "微软雅黑";
  28.  
  29. 12、代码实现文本"老坛酸菜牛肉面"在100px*100px的div.box盒子中水平垂直显示
    <div class="box" style="height:100px; width: 100px;>老坛酸菜牛肉面</div>
  30.  
  31. 13、简述什么是display，为什么要使用display
    display 属性规定元素应该生成的框的类型。
  32.  
  33. 这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等文档类型，
    如果使用 display 不谨慎会很危险，因为可能违反 HTML 中已经定义的显示层次结构。
    对于 XML，由于 XML 没有内置的这种层次结构，所有 display 是绝对必要的。
  34.  
  35. 14、列举display三种属性值，并分析每种属性值下，显示方式 css样式支持程度 嵌套规则等特性
        /*display:block: 块级标签, 独占一行, 支持所有css样式*/
        /*display:inline: 内联(行级)标签, 同行显示, 不支持宽高*/
        /*display:inline-block: 内联块标签, 同行显示, 支持所有css样式*/
  36.  
  37.         /*标签的嵌套规则*/
            /*①*/
            /*block可以嵌套所有显示类型标签, div | h1~h6 | p*/
            /*注: hn与p属于文本类型标签,所有一般只嵌套inline标签*/
            /*②*/
            /*inline标签只能嵌套inline标签, span | i | b | sup | sub | ins */
            /*③*/
            /*inline-block可以嵌套其他类型标签, 但不建议嵌套任意类型标签 img | input*/
  38.  
  39. 15、列举一下复杂选择器组合，并分析产生优先级的规则
    群组选择器,子代(后代)选择器,相邻(兄弟)选择器,交集选择器
    组合选择器优先级与权值相关，权值为权重和
    通配权重1,标签10,类 属性 100,id 1000,!important 10000
    - 选择器权值比较，只关心权重和，不更新选择器位置
    - 不同级别的选择器间不具备可比性：1个类选择器优先级高于n个标签选择器的任意组合
  40.  
  41. 16、列举7个或更多伪类选择器，并一一做简单介绍
        1、a标签四大伪类
        - :link：未访问状态
        - :hover：悬浮状态
        - :active：活跃状态
        - :visited：已访问状态
        2、内容伪类
        - :before：内容之前
        - :after：内容之后
        3、索引伪类
        - :nth-child(n)：位置优先，再匹配类型
        - :nth-of-type(n)：类型优先，再匹配位置
        4、取反伪类
        - :not(selector)：对selector进行取反
  42.  
  43. 17、简述什么是盒模型，它的组成部分是什么
    - 广义盒模型：文档中所有功能性及内容性标签，及文档中所有显示性标签
    - 侠义盒模型：文档中以块级形式存在的标签（块级标签拥有盒模型100%特性且最常用）
    - 盒模型组成：margin + border + padding + content
  44.  
  45. 18、代码实现100*100的sub盒子在200*200的sup盒子水平垂直居中显示
    <head>
        <style type="text/css">
        .sup {
            width: 200px;
            height: 200px;
  46.  
  47.     }
        .sub {
        width: 100px;
        height: 100px;
  48.  
  49.     margin-top: -150px;
        margin-left: 50px;
        }
        </style>
    </head>
    <body>
        <div class="sup"></div>
        <div class="sub"></div>
    </body>
  50.  
  51. 19、代码举例说明精灵图的使用
    .header h1 {
        background: url("../img/bg.png") no-repeat 0 -150px;
    }
    20、列举已学标签的reset操作
    html, body, ul, p, h1, h2, h3, h4, h5, h6 {
        margin: 0;
        padding: 0;
    }
    ul {
        list-style: none;
    }
    a {
        color: black;
        text-decoration: none;
    }
  52.  
  53. 二、代码
    完成w3c网站主页的编写

Python-HTML CSS题目的更多相关文章

  1. 谈谈一些有趣的CSS题目（十二）-- 你该知道的字体 font-family

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  2. 谈谈一些有趣的CSS题目（十一）-- reset.css 知多少？

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  3. 谈谈一些有趣的CSS题目（三）-- 层叠顺序与堆栈上下文知多少

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  4. 谈谈一些有趣的CSS题目（一）-- 左边竖条的实现方法

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  5. 谈谈一些有趣的CSS题目（二）-- 从条纹边框的实现谈盒子模型

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  6. 谈谈一些有趣的CSS题目（四）-- 从倒影说起，谈谈 CSS 继承 inherit

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  7. 谈谈一些有趣的CSS题目（五）-- 单行居中，两行居左，超过两行省略

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  8. 谈谈一些有趣的CSS题目（六）-- 全兼容的多列均匀布局问题

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  9. 谈谈一些有趣的CSS题目（七）-- 消失的边界线问题

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  10. 谈谈一些有趣的CSS题目（八）-- 纯CSS的导航栏Tab切换方案

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

随机推荐

  1. JAVA中String.format()的使用

    String类的format()方法用于创建格式化的字符串以及连接多个字符串对象.format()方法有两种重载形式:1.format(String format, Object... args) 新 ...

  2. 使用php与mysql构建我们的网站

    技术这个玩意就是要不断的去使用,才能够熟能生巧.今天我记录的使用php与mysql构建我们的网站,其实是我两年前的时候写的项目. 现在看看自己以前写的个人项目,也会感叹时间究竟带走了什么?好记性不如烂 ...

  3. 修改select下拉选的默认选中值

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. js兼容火狐显示上传图片预览效果

    js兼容火狐显示上传图片预览效果[谷歌也适用] <!doctype html> <html> <head> <meta content="text/ ...

  5. 字节流转字符流OutputStreamWriter、InputStreamReader，关闭流的方法

    转换时可以指定编码格式:GBK.UTF-8 public class Demo { public static void main(String[] args) { File f = new File ...

  6. Python基础【day03】：文件操作（七）

    零.本节内容 1.文件常用操作汇总 2.打开文件 3.操作文件 4.关闭文件 一.文件常用操作汇总 二.打开文件 1.普通打开模式 r,英文:read,只读模式(默认) w,英文:write,只写模式 ...

  7. AbstractQueuedSynchronizer同步队列与Condition等待队列协同机制

    概要: AQS维护了一个同步队列 Condition是JUC的一个接口,AQS的ConditionObject实现了这个接口,维护了一个等待队列(等待signal信号的队列) 线程调用reentran ...

  8. 如何用matplotlib绘制决策边界

    import matplotlib.pyplot as plt import numpy as np import sklearn import sklearn.datasets import skl ...

  9. ThinkPHP 3.2 vendor()方法的深入研究及Phpqrcode的正确扩展

    ThinkPHP vendor 方法导入第三方类库 第三方类库 第三方类库指除了 ThinkPHP 框架.应用项目类库之外的其他类库,一般由第三方系统或产品提供,如 Smarty.Zend 等系统的类 ...

  10. link 和@import 的区别

    两者都为外部引入css的方式. 他们的区别: 1.link属于HTML标签,而@import是css提供的 2.页面被加载时候,link会同时加载,而@import引入的文件会等到页面加载完成之后再进 ...