最近在阅读Head first HTML and CSS, 写一些笔记。

  小知识:

  1. 浏览器会忽略HTML文档中的制表符,回车和大部分空格——要用标记

  2. WYSIWYG——使得用户在视图中所看到文档与该文档的最终产品具有相同的样式

  3. <!-- Hey, it's annotate -->

  4. 元素=开始标记+内容+结束标记  <!-- it's an element -->

  5. CSS---Cascading style sheet

Style元素:

  1.格式

    

<head>    <!--写在head部分里面 -->
<title> Spam </title>
<style type="text/css"> <!-- 可选属性type,告诉浏览器你在使用什么类型的样式 -->
<!-- 定义页面样式 --> </style>
</head>

  2, 完全可以只使用<style>而不带属性,所有浏览器都知道你指的是css。

  3. 例子

    (1).代码

    

<!DOCTYPE html>
<html lang="en">    
<head>
<meta charset="UTF-8">
<title>Hello World</title>
<style type="text/css"> <!-- css的语法,样式定义式后面有分号 -->
body{
background-color: salmon;
margin-right: 20%;
margin-left: 20%;
margin-top: 10%;
padding: 10px 10px 10px 10px;
border: black dotted 2px;
font-family: sans-serif;
}
</style>
</head>
<body>
<h1>Hello, world</h1>
<p>I don't know what to do</p>
<h2>My Jam</h2>
<p>Long time----Cake</p>
<p>Soap---Melanie Martinez</p>
<p>Cry Baby --- Melanie Martinez</p>
<h2>Poem</h2>
<p>O captain, my captain</p>
</body>
</html>

      (2).运行结果

    4.例子解析

      (1).注意css里面的分号

      (2) margin-lef/right/... 外边距

      (3) padding 内边距, 注意四边的距离, 而且距离之间用空格隔开, 不用逗号

      (4) border 边界,IE浏览器不一定看得到, 可定义颜色,大小,类型等等

<HTML>初识HTML的更多相关文章

  1. Android动画效果之初识Property Animation(属性动画)

    前言: 前面两篇介绍了Android的Tween Animation(补间动画) Android动画效果之Tween Animation(补间动画).Frame Animation(逐帧动画)Andr ...

  2. 初识Hadoop

    第一部分:              初识Hadoop 一.             谁说大象不能跳舞 业务数据越来越多,用关系型数据库来存储和处理数据越来越感觉吃力,一个查询或者一个导出,要执行很长 ...

  3. python学习笔记(基础四:模块初识、pyc和PyCodeObject是什么)

    一.模块初识(一) 模块,也叫库.库有标准库第三方库. 注意事项:文件名不能和导入的模块名相同 1. sys模块 import sys print(sys.path) #打印环境变量 print(sy ...

  4. 初识IOS,Label控件的应用。

    初识IOS,Label控件的应用. // // ViewController.m // Gua.test // // Created by 郭美男 on 16/5/31. // Copyright © ...

  5. UI篇(初识君面)

    我们的APP要想吸引用户,就要把UI(脸蛋)搞漂亮一点.毕竟好的外貌是增进人际关系的第一步,我们程序员看到一个APP时,第一眼就是看这个软件的功能,不去关心界面是否漂亮,看到好的程序会说"我 ...

  6. Python导出Excel为Lua/Json/Xml实例教程(一):初识Python

    Python导出Excel为Lua/Json/Xml实例教程(一):初识Python 相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出 ...

  7. 初识SpringMvc

    初识SpringMvc springMvc简介:SpringMVC也叫Spring Web mvc,属于表现层的框架.Spring MVC是Spring框架的一部分,是在Spring3.0后发布的 s ...

  8. 初识redis数据类型

    初识redis数据类型 1.String(字符串) string是redis最基本的类型,一个key对应一个value. string类型是二进制安全的.意思是redis的string可以包含任何数据 ...

  9. Redis初识、设计思想与一些学习资源推荐

    一.Redis简介 1.什么是Redis Redis 是一个开源的使用ANSI C 语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value 数据库,并提供多种语言的API.从2010 年 ...

  10. MongoDB【第一篇】MongodDB初识

    NoSQL介绍 一.NoSQL简介 NoSQL,全称是”Not Only Sql”,指的是非关系型的数据库. 非关系型数据库主要有这些特点:非关系型的.分布式的.开源的.水平可扩展的. 原始的目的是为 ...

随机推荐

  1. SQL Server数据库文件与文件组总结

    文件和文件组概念 关于文件与文件组,简单概括如下,详情请参考官方文档"数据库文件和文件组Database Files and Filegroups"或更多相关资料: 数据文件概念: ...

  2. django 时区和系统(ubuntu)时区修改

    django时区默认使用UTC,中国人使用CST东八区. settings.py改为上海时区 #settings.py TIME_ZONE = 'Asia/Shanghai' # True:使用UTC ...

  3. github在README.md中插入图片

    例子 ![image](https://raw.githubusercontent.com/sunday123/Pendant/master/1.PNG)

  4. 测试面试话题8:测试人员如何让开发少写bug?

    在测试过程中和不同开发合作,往往会发现一些bug都是大多数开发人员常出现的错误,为了帮助开发人员,也减少测试的重复工作量,非常有必要将以往出现的bug做整理,分析原因,让开发知道这些bug, 避免再次 ...

  5. 【Teradata SQL】日历函数查询

    查询2018年agmt_id=1076226890174464676612的,且金额类型代码为0212,每日协议金额. 1.协议金额历史表取某一日数据(20180101) sel t.start_dt ...

  6. ubuntu18.04安装spark(伪分布式)

    在安装spark之前,首先需要安装配置Hadoop,这个就不做详细介绍了,可以参看博主的另一篇: https://blog.csdn.net/weixin_42001089/article/detai ...

  7. openstack第五章:cinder

    第五篇cinder— 存储服务   一.cinder 介绍:   理解 Block Storage 操作系统获得存储空间的方式一般有两种: 通过某种协议(SAS,SCSI,SAN,iSCSI 等)挂接 ...

  8. iic接口介绍

    最近遇到一个BUG,跟IIC通信有关,所以借这个机会总结一下IIC总线协议 1.引脚接口介绍 1.A0,A1,A2为24LC64的片选信号,IIC总线最多可以挂载8个IIC接口器件,通过对A0,A1, ...

  9. Java 关于cannot resolve symbol 'log'报错问题

    我用的是IDEA,报错的内容是:cannot resolve symbol 'log' 如图所示: 解决方法: 1.安装插件:Settings→Plugins,输入lom回车: 2.然后选择Insta ...

  10. 《为大量出现的KPI流快速部署异常检测模型》 笔记

    以下我为这篇<Rapid Deployment of Anomaly Detection Models for Large Number of Emerging KPI Streams>做 ...