1. classes 和 IDs 的不同

    • class 选择器用于描述一组元素的样式，class 选择器有别于id选择器，class可以在多个元素中使用。
  2. HTML 元素 elements
    • 从开始标签（start tag）到结束标签（end tag）的所有代码。

    • 例子

      <title>peculiarly</title>
  3. What are tags?
    • The basic structure of an HTML document includes tags, which surround content and apply meaning to it.
    • demo: opening tag <head> and closing tag </head>
  4. What are forms?
    • <form> 标签用于创建供用户输入的 HTML 表单。
  5. What is a div?
    • <div> 可定义文档中的分区或节（division/section）。
  6. What is the difference between "pixels" and "ems"?
    • px像素（Pixel），相对长度单位。px 是相对于显示器屏幕分辨率而言的。

      • IE无法调整那些使用 px 作为单位的字体大小；
    • em 是相对长度单位，相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
      • em 的值并不是固定的；
      • em 会继承父级元素的字体大小。
  7. CSS 继承
    • inherit

    • 例子

      div{color: red;} .extra div{color: inderit;}
  8. 移动页面元素的两种 CSS 属性
    • float
    • position
  9. CSS 插入样式表的三种方法
    • 外部样式表(External style sheet)

      • 例子

        <head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
    • 内部样式表(Internal style sheet)

      • 例子

        <head>
<style>
    p {
        color: blue;
        margin-right: 20px;
        }
</style>
</head>

    • 内联样式(Inline style)

      • 例子

        <p style="color: blue; margin-right: 20px;">A paragraph.</p>

HTML and CSS basis的更多相关文章

  1. Matplotlib数据可视化（3）：文本与轴

      在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...

  2. CSS 弹性盒子 flex的三个属性：grow、shrink、basis

    flex-grow 首先介绍flex-grow属性,flex-grow会在容器太大时(图片A.B的宽度和 < 父容器宽度)对元素作出调整. 如果图片A的flex-grow属性的值为 1,图片B的 ...

  3. CSS 继承深度解析

    FROM ME: 之前在研究前端性能优化的时候,就有学习关于CSS中“善用CSS中的继承”. 原文:CSS Inheritance, The Cascade And Global Scope: You ...

  4. 前端总结·基础篇·CSS（一）布局

    目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) &am ...

  5. CSS弹性盒子的基本用法

    .container { width: 302px; height: 302px; border: 1px solid; display: flex } .item { width: 100px; h ...

  6. CSS（六）- 内容布局 - Flexbox

    Flexbox是CSS3提供的用于布局的一套新属性,是为了应对行内块.浮动和表格格式产生的问题而生的.其包含针对容器(弹性容器,flex container)和针对其直接子元素(弹性项,flex it ...

  7. CSS的未来

    仅供参考 前言 完成<CSS核心技术与实战>这本书,已有一个多月了,而这篇文章原本是打算写在那本书里面的,但本章讲解的内容,毕竟属于CSS未来的范畴,而这一切都还不能够确定下来,所以这一章 ...

  8. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  9. 前端css兼容性与易混淆的点

    一.常用的骨灰级清除浮动 .clearfix:after { content: "."; display: block; height:; clear: both; visibil ...

随机推荐

  1. CSS3常用属性及效果汇总

    本文转载于<https://blog.csdn.net/lyznice/article/details/54575905> 一.2D效果属性 要使用这些属性,我们需要通过 transfor ...

  2. linux挂载iscsi出现的问题

    挂载的时候我们可以使用永久挂载但是这里我们就需要注意了正常的永久挂载可能会导致系统起不来因为这里我们使用的是服务端的硬盘为网络设备而开机的读取中 会先读取/etc/fstab下的内容 之后再读取网络的 ...

  3. c# 线程异步处理

    public class AsyncHelper { private static readonly TaskFactory _myTaskFactory = new TaskFactory(Canc ...

  4. .NET 5 = .NET Core vNext

    Introducing .NET 5 .NET 5 = .NET Core vNext .NET 5 is the next step forward with .NET Core. The proj ...

  5. 目标检测-Cascade-RCNN

    转载:https://zhuanlan.zhihu.com/p/36095768 Cascade R-CNN: Delving into High Quality Object Detection 论 ...

  6. 怎样获取java新IO的Path文件大小

    import org.junit.Test; import java.io.IOException; import java.nio.file.Files; import java.nio.file. ...

  7. 同一个电脑配置两个github账号

    mac中.ssh文件夹在根目录下,所以表示成 ~/.ssh/. 一.同一个电脑配置两个github账号1.分别为两个GitHub账号生成SSH密钥 $ cd ~/.ssh $ ssh-keygen - ...

  8. sws office-强大小巧的开源office

    sws office是一款由国际软件分享组织于2019年刚刚开发完成的一个开源office,目的是为了响应CR2019的号召,开发一个体积只有2.2MB,占用内存小,运行速度极快的office,它支持 ...

  9. STL标准模板库之set

    目录 一.关联式容器 二.什么是set? 特点 优缺点和适用场景: 三.定义及初始化 四.基本操作 1)容量函数 2)修改函数 3)迭代器 4)其他函数 五.与序列容器的不同点 一.关联式容器 关联式 ...

  10. jdbc访问oracle超慢，但是PLSQL访问正常

    oracle数据库连接非常慢,sqlplus很快,用客户端就很慢,十几秒才好.然后服务器内存一下就飙升到了90%,最开始以为是表空间占满了,数据库连接数占满了.折腾了半天,重启,还是很慢.应用连接数据 ...