• 掌握表单标签

<form action="http://www.baidu.com" method="post">

    ...

</form>

  • 了解CSS的概念

    • 英文缩写 Cascading Style Sheet
    • 层叠样式表
    • 层叠:层层叠加
    • 样式表:样式的集合(属性的集合),不是html的属性,而是CSS的属性

  • 掌握CSS的引入方式(heml和css)

    • 通过style标签的属性

      <!--通过style属性-->
      
    <div style="border: 1px solid red;">div一</div>
    • 通过style标签 
      <head>
      
    <!--通过style标签-->
      
    <style>
      
        div {
      
            border: 1px solid red;
      
        }
      
    </style>
      
</head>
    • 通过link标签结合(外部引入) 
      <link rel="stylesheet" href="../../css/divcss.css" />

  • 了解CSS的基本语法和常用的选择器

    • 语法规范

　　{

　　　　　　　　　属性:属性值 属性值

　　　　　　　　　　　　属性:属性值 属性值

　　　　　　　　}

    • 常用选择器

      • 标签选择器; 语法: 标签名{css代码}

        <style>
        
/*标签选择器*/
        
div{
        
    border: 1px solid red;
        
}
        
</style>
      • 类选择器语法: .类名{css代码} 
        <style>
        
    /*类选择器*/
        
    .divClass{
        
        border: 1px solid red;
        
    }

</style>
      • id选择器;语法: #id名{css代码} 
        <style>
        
    /*id选择器*/
        
    #divId{
        
        border: 1px red solid;
        
    }

</style>
      • 组合选择器 语法:选择器,选择器{css代码} 
        /*组合选择器*/
        
div,span{
        
    border: 1px solid red;
        
}
      • 后代选择器 语法:选择器1 选择器2 {css 代码}
      • 子代选择器 语法:选择器1>选择器2 {css 代码}:

  • 了解CSS的盒子模型,浮动.

    • 设置浮动

      <div style="float:left;"></div>
  • 　css盒子模型
    • margin:外边距
    • padding:内边距,里面的元素和边框之间的距离 
      <!DOCTYPE html>
      
<html>

    <head>
      
        <meta charset="UTF-8">
      
        <title></title>

    </head>

    <body>
      
        <div style="height: 300px; width: 300px ;border: red solid 1px;">
      
            <div style="background-color: blue; height: 100px;text-decoration: underline; width: 100px; border-style: dashed; margin: 35px; padding: 20PX;">

                BBB
      
                中国
      
            </div>
      
        </div>

    </body>

</html>

day02HTML_CSS的更多相关文章

随机推荐

  1. android 统计启动时长，标准

    一.启动的类型 冷启 动,application没有被创建,需要先创建进程,然后启动MainActivity.由于这个过程需要fork一个新进程,所以耗时. 热启动,同上面对照,已经启动过applic ...

  2. BandwagonHost搬瓦工VPS自建

    地址:https://bwh1.net/aff.php?aff=18648 ,购买$2.99的就够用了(现在没有$2.99的了,最低是$4.99) 步骤一: 步骤二: 步骤三:选图中的选项,然后点 A ...

  3. C++开发象棋一 绘制棋盘

    这是我要和大家分享的基于C++和MFC开发的一个象棋程序,目的是练习编程实践和大家分享同时希望大家能给出指教. 进入主题 一.棋盘分析 这是我绘制的棋盘,棋盘的组成由9条竖线和10条横线构成.这儿我们 ...

  4. MongoDB增删改查操作详解

    一.插入 MongoDB的插入操作很简单,使用insert方法,这里演示从创建数据库.创建集合到插入文档.查询文档. 集合创建方法参数说明: size:集合最大空间 max:集合最多文档数量 (超出s ...

  5. MongoDB自动增长

    MongoDB 没有像SQL一样有自动增长的功能,如果我们需要实现ObjectId自动增长功能,可以通过编程的方式来实现.步骤如下: 1. 创建counters集合: db.createCollect ...

  6. LeetCode 287. Find the Duplicate Number （找到重复的数字）

    Given an array nums containing n + 1 integers where each integer is between 1 and n (inclusive), pro ...

  7. 静默获取微信用户openid如此简单，只需要一句话

    页面A getopenid.php <?php /** * Created by PhpStorm. * User: sunjianyin * Date: 2017/10/7 * Time: 下 ...

  8. Spring Bean装配方式

    Spring装配机制 在xml中进行显示配置 在Java中进行显示配置 隐式bean发现机制和自动装配 自动化装配bean 组件扫描(component scanning),Spring会自动发现应用 ...

  9. swift之函数式编程（三）

    文章来源于<Functional Programing in Swift>,本系列仅仅是观后概括的一些内容 Wrapping Core Image 上一篇文章我们介绍了 高阶函数并且展示了 ...

  10. Nodejs MSSQL详细解读

    MSSQL 是Nodejs用于连接Microsoft SQL Server 的插件. 安装方法 npm install mssql 配置Config const config = { user: '. ...