黑马程序员技术交流社区
标题: HTML & CSS基础知识 [打印本页]
作者: KevinQIN 时间: 2019-3-19 13:24
标题: HTML & CSS基础知识
本帖最后由 KevinQIN 于 2019-3-19 13:54 编辑
1、HTML理解：HTML是网页元素的本质，用一个比喻来说，要是把网页比作美轮美奂的成品房的话，它就是一开始的毛坯房。它带有原生的丑陋，但之后所有美化的技术的对象都是它，所以它的结构和组成，十分的重要。
在写HTML文档时，规范格式为
<!DOCTYPE html><html><head> //标题 用来存放附加信息</head><body> //用来存放代码</body></html>
可在Head中添加：
a、设置浏览器工具栏的标题
<title>Title of the document</title>
b、引入外部资源（css）
<link rel="stylesheet" type="text/css" href="mystyle.css"> c、添加脚本外部文件
<script src = “myScript.js”></script>
d、防止乱码
<meta charset="utf-8">
样式知识摘录：
链接
指指向链接后，鼠标变成手形，但单击后仍停留在当前页面。
<a href="#">链接文字</a>
让链接在新窗口里打开
<a href="//www.w3cschool.cn/" target="_blank">访问W3CSchool教程!</a>
图片
<img src=“图片地址”alt=“失去的图片的信息”>
2、CSS
简介：css是对毛胚房进行的装修，它在网页中负责的操作是告诉浏览器这个HTML元素应该要放在哪里，应该是什么颜色的，等等这一类的操作。
a、class类选择器 和 id 选择器的差别
id只能在一个对象上使用
class可以在多个对象上使用
b、盒子模型
- Margin（外边距） - 空白边框区域。Margin没有背景颜色，它是完全透明
- Border（边框） - 边框周围的填充和内容。边框是受到盒子的背景颜色影响
- Padding（内边距） - 空白内容周围的区域。会受到框中填充的背景颜色影响
- Content（内容） - 盒子的内容，显示文本和图像（设置的width和height属性单单决定content的内容）
c、定位
Static：无定位
Fixed：固定在页面的位置，即使网页滚动也不变
Relative：相对定位元素的定位是相对其正常位置。
Absolute ：绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>:
d、浮动
CSS float 属性定义元素在哪个方向浮动，浮动元素会生成一个块级框，直到该块级框的外边缘碰到包含框或者其他的浮动框为止。
| 欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |