美文网首页
HTML第一天

HTML第一天

作者: 冰爷05 | 来源:发表于2016-12-27 20:55 被阅读0次

公司内部开发流程

  1. 产品需求 产品经理(第一次例会去掉不合理的需求);

  2. 项目设计 视觉设计师 /交互设计(第二次例会排工期);

  3. 前/后端开发;

  4. 测试;

  5. 上线运营。


前端三要素

HTML 超文本标记语言 结构

CSS 层叠样式表 样式

JS 脚本语言 行为

HTML结构

<!-- 文档头(类型)声明 
告诉浏览器文档类型是HTML5
注意:不是标签-->
<!DOCTYPE html>
<!-- 根元素 -->
<html>
    <!-- 头部 -->
    <head>
        <!-- head 内部包含的绝大部分内容是不可见的
        主要用来辅助页面的功能 -->
        <!-- 定义页面标题 -->
        <title></title>
        <!--meta: 定义页面的元数据 
            属性: 
                charset 针对搜索引擎和解析格式的属性-->
        <meta charset="utf-8">
    </head>
    <!-- 身体 -->
    <body>
        <!-- body 绝大部分都是可见的
        主要用来搭建HTML结构 -->
        <div></div>
    </body>
</html>

CSS的引入

  • 内联样式表:直接写在签的内部
    <div style="width: 300px;height: 300px;background-color: red"></div>

  • 内部样式表:需要写在head标签内部

    标签名选择器

 <style type="text/css">
  div{
   width:300px;
   height: 300px;
   background-color:blue;
  }
 </style>
</head>```

*作用范围:所有的"同标签".*
​       *可以被多个标签同时使用.*

  **ID选择器**

```<head>
 <style type="text/css">
 #div_1{
   width:300px;
   height: 300px;
   background-color:blue;
  }
 </style>
</head>

 <div id="div_1"></div>```

*作用范围:具有这个ID名称的唯一标签.
​       只允许作用在一个标签上.*

**class选择器**

```<head>
 <style type="text/css">
  .div{
   width:300px;
   height: 300px;
   background-color:blue;
  }
 </style>
</head>

<div class="div"></div>```

*作用范围:所有同类名的标签.*

**优先级**
内联样式表>ID选择器>类选择器>标签名选择器
* **外部样式**

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

**引入方式优先级:**
a:当选择器的优先级相同时,谁后加载谁执行;
b:当选择器的优先级不同时,谁的优先级高,谁先执行.
[bingo231](http://www.baidu.com) 

![](https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1482842604&di=075f40679786b5f97518117fe8ebb54b&src=http://img011.hc360.cn/g7/M04/39/C5/wKhQs1Mzm-2EDZmZAAAAACiERG8826.jpg)

脚注[^1]
[^1]:aaa

相关文章

  • HTML5---01

    HTML5 第一天 一、什么是 HTML5 HTML5 的概念与定义 定义:HTML5 定义了 HTML 标准的...

  • html5和css3

    HTML 5 基础(第一天)1.HTML 新增基础结构标签herdernavsectionarticleaside...

  • 第一天

    今天第一天学习HTML,了解了一下什么是HTML 1.什么是HTML HTML叫做超文本标记语言,标准通用标记语言...

  • 基础

    HTML 5 基础(第一天) 1.HTML 新增基础结构标签 header nav section article...

  • 「blaze-html」Day 1. - 30天Hackage之

    30天Hackage之旅,第一天献给 blaze-html 这个『贼快』(blazing fast) 的 HTML...

  • web面试题

    第一天 HTML5有哪些新特性?如何处理HTML5新标签的浏览器兼容问题?如何区分HTML和HTML5? css3...

  • Python实战计划学习笔记(一):做一个网页

    实战第一天,做个网页。 效果图 代码 总结 网页主要有html, css以及JavaScript组成。html负责...

  • MARKDOWN

    A我今天学到了什么 html和css 第一天的笔记

  • HTML第一天

    Web 标准 主要包括: 结构(HTML) 、表现(CSS)、 行为(JavaScript) HTML 指的是超文...

  • HTML第一天

    公司内部开发流程 产品需求 产品经理(第一次例会去掉不合理的需求); 项目设计 视觉设计师 /交互设计(第二次例会...

网友评论

      本文标题:HTML第一天

      本文链接:https://www.haomeiwen.com/subject/fcuevttx.html