最近在阅读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. pyspider+PhantomJS的代理设置

    环境:pyspider0.3.9 PhantomJS2.1.1,均为最新版 进程用supervisor托管的. 其中需要加的几个地方: webui进程: pyspider -c config.json ...

  2. cmd黑客入侵命令大全

    nbtstat -A ip 对方136到139其中一个端口开了的话,就可查看对方最近登陆的用户名(03前的为用户名)-注意:参数-A要大写 tracert -参数 ip(或计算机名) 跟踪路由(数据包 ...

  3. Win7/Win8.1升级Win10后屏幕一直闪烁怎么办？

    有些用户在把Win7/Win8.1升级到Win10正式版后,发现屏幕一直不停闪烁,以至于无法正常使用.出现这种情况的原因可能有很多,微软社区的论坛审阅人Alex_Shen给出了一种解决方案:进入安全模 ...

  4. 我的第一个python web开发框架（37）——职位管理功能

    对于职位管理,我们可以理解它为角色权限的管理,就像前面所说的一样,有了职位管理,后台管理系统绑定好对应的权限以后,新进员工.离职或岗位调整,管理员操作起来就非常的便捷了,只需要重新绑定对应职位就可以做 ...

  5. Docker平台的基本使用方法

    1.运行一个 container并加载镜像centos,运行起来这个实例后,在实例中执行 /bin/bash命令 docker常用参数: run  运行 -i  以交互模式运行容器,通常与 -t 同时 ...

  6. CentOS7.x安装kickstart

    kickstart简介 kickstartkickstart是RedHat公司开源的软件,所以对CentOS兼容性最好,是一种无人值守的安装方式就是将手动安装配置的步骤,记录到文件中,然后通过kick ...

  7. Python学习案例之Web版语音合成播报

    前言 语音合成技术能将用户输入的文字,转换成流畅自然的语音输出,并且可以支持语速.音调.音量设置,打破传统文字式人机交互的方式,让人机沟通更自然. 应用场景 将游戏场景中的公告.任务或派单信息通过语音 ...

  8. FineUICore（基础版）v5.4.0已发布！

    FineUICore(基础版)已发布,请先加入知识星球,下载后可以永久免费商用:

  9. iOS 快捷下载和安装并使用CocoaPods

    CocoaPods是什么? 当你开发iOS应用时,会经常使用到很多第三方开源类库,比如JSONKit,AFNetWorking等等.可能某个类库又用到其他类库,所以要使用它,手动一个个去下载所需类库十 ...

  10. clipboardjs复制到粘贴板

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&qu ...