A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© casting 初级黑马   /  2018-10-25 12:30  /  1423 人查看  /  4 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

最近开始学习前,总结一下。
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上下


4 个回复

倒序浏览
回复 使用道具 举报
回复 使用道具 举报
回复 使用道具 举报
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马