黑马程序员技术交流社区

标题: 学习新的 [打印本页]

作者: casting 时间: 2018-10-25 12:30
标题: 学习新的
最近开始学习前，总结一下。
html基本结构：

[Python] 纯文本查看 复制代码

<!DOCTYPE html>  

<!--html的文档声明,声明当前html文档的版本-->

<html>     

<!--根标签: html开始标签 -->

    <head>       

<!--html标签中的第一个子标签: head开始标签-->

            <meta charset="UTF-8">    

<!--单个标签meta: 主要用于当前文档设置, 这里设置的是文档的编码格式 utf-8-->

            <title>Document</title>   <!--title标签: 主要用于设置当前文档标题-->

    </head>      

<!--html标签中的第一个子标签: head结束标签-->

    <body>       

<!--html标签中的第二个子标签: body开始标签-->

    </body>      

<!--html标签中的第二个子标签: body结束标签-->

</html>          

<!--根标签: html结束标签 -->

html语言中注释的写法:  <!-- 注释的内容 -->

标签的分类：
标签按照显示的不同, 可以分为两类:
- 块元素 (行元素): h1----h6    p       div
- 内联元素 (行内元素): a    img    span

CSS引入方法：
内联式:
通过标签的 style 属性, 在标签上直接写样式.
<div  style="width:100px; height:100px; background:red;">
这是个div标签
</div>

嵌入式:
通过 style 标签, 在网页上创建嵌入的样式表.（放在head）
<head>
<style>
      div {
         width: 100px;
         height: 100px;
         background: red;
      }
</style>
</head>

外联式:
先写一个.css文件
      div {
         width: 100px;
         height: 100px;
         background: red;
      }
在html  head中（不加style）
<link rel="stylesheet"  href="css/样式文件名.css">

盒子的真实尺寸：
- 盒子宽度 = width + padding左右 + border左右
- 盒子高度 = height + padding上下 + border上下

作者: 魔都黑马少年梦 时间: 2018-10-25 14:07

作者: 梦缠绕的时候 时间: 2018-10-25 15:45

作者: 小影姐姐 时间: 2018-10-28 15:38

作者: 不二晨 时间: 2018-10-31 14:17

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2