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. Java FTP客户端开源类库 edtFTPj

    edtFTPj/Free是免费的流行的Java FTP库,全球公司依靠edtFTPj /Free 为它们的Java应用程序添加FTP客户端功能. (收费的支持SFTP.FTPS的edtFTPj/PRO ...

  2. TreeView如何实现选中的节点上移或下移 [问题点数：20分，结帖人nww2002]

    在TreeView中,如何实现选中一节点,右键点击上移或下移 TTreeNode.MoveTo() 一.获得Tree上的结点var NowNode : TTreeNode;begin  NowNode ...

  3. 查看mycat日志

    查看日志: tail -f /usr/local/mycat/logs/wrapper.log

  4. ubuntu 16 搭建只能上传不可下载删除ftp服务

    安装 VSFTPD,(建议使用FileZill测试,报错能看到原因) 如果使用window文件管理连接,要注意下图的设置 使用 apt-get 安装 vsftpd sudo apt-get insta ...

  5. 在 Laravel 中使用 MongoDB

     可参考:https://blog.csdn.net/weixin_38682852/article/details/80840678 环境准备 安装 MongoDB 安装 PHP-MongoDB 扩 ...

  6. Install Virtualbox on CentOS7---(後話，最終還是沒有用virtualbox做VM server ,感覺只適用于桌面)

    參考: https://wiki.centos.org/zh-tw/HowTos/Virtualization/VirtualBox cd /etc/yum.repos.d wget http://d ...

  7. 图像欧拉数计算 matlab实现

    EUL = C - H 其中EUL表示欧拉数  C表示对象数 H表示孔洞数 欧拉数常用来识别数字: 识别数字 8 ,8 的欧拉数为 -1 ,不同于0,1,2,3,4,5,6,7,9 close all ...

  8. python下载一些包出现time out的问题解决

    更换镜像点: pip install -i https://pypi.tuna.tsinghua.edu.cn/simple package 将package换成自己要下载的包即可 亲测还挺快的

  9. Linux系统管理----LVM逻辑卷和磁盘配额作业习题

    1．为主机增加80G SCSI 接口硬盘 2．划分三个各20G的主分区 [root@localhost chen]# fdisk /dev/sdb 命令(输入 m 获取帮助):n Partition ...

  10. twig 模板控制器对应列表

    {{ render(controller(metas.header,{request:app.request, course: course, member: member|default(null) ...