一，效果图。

二，代码。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>html css</title>

    <!--html使用样式-->

    <style type="text/css">

    h1 {

        color: red;

    }

    p {

        color: blue;

    }

    </style>

    <!--链接到一个外部样式表-->

    <link rel="stylesheet" type="text/css" href="styles.css">

    <!--内部样式表-->

    <style type="text/css">

    body {

        background-color: yellow;

    }

    p {

        color: blue;

    }

    </style>

    <!--外部样式表-->

    <link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

<body style="">

    <h1>This is heading</h1>

    <p>This is paragraph</p>

    <!--style属性制作一个没有下划线的链接-->

    <a href="http://www.baidu.com" style="text-decoration:none">百度</a>

    <h1>I am formatted with an external style sheet</h1>

    <p>Me too</p>

    <!--内联样式-->

    <p style="color:blue;margin-left=20px;">this is a paragraph</p>

    <!--背景颜色-->

    <h2 style="">this is a heading</h2>

    <p style="">this is a paragraph.</p>

    <!--字体，字体颜色，字体大小-->

    <h1 style="font-family:verdana;">A heading</h1>

    <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>

    <!--文本对齐方式-->

    <h1 style="text-align:center;">Center-aligned heading</h1>

    <p> this is a paragraph</p>

</body>

</html>

参考资料：《菜鸟教程》

【代码笔记】Web-HTML-CSS的更多相关文章

  1. 《编写高质量代码：Web 前端开发修炼之道》 笔记与读后感

    编写高质量代码:Web 前端开发修炼之道/曹刘阳著. —北京:机械工业出版社,2010.5 第一版 涉及到的知识点: 1. CSS Sprites 在国内很多人叫css精灵,是一种网页图片应用处理方式 ...

  2. WEB前端 CSS(非布局)

    目录 WEB前端 CSS CSS引入方式 CSS结构 CSS选择器 直接选择器 组合选择器 分组选择器 也叫并集选择器 属性选择器 伪类选择器 伪元素选择器 CSS选择器是一个查找的过程,高效的查找影 ...

  3. DW网页代码笔记

    DW网页代码笔记 1.样式.       class  插入类样式  标签技术(html)解决页面的内容样式技术(css)解决页面的外观脚本技术       解决页面动态交互问题<form> ...

  4. 前端学习:JS(面向对象)代码笔记

    前端学习:JS(面向对象)代码笔记 前端学习:JS面向对象知识学习(图解) 创建类和对象 创建对象方式1调用Object函数 <body> </body> <script ...

  5. CSS3基础——笔记+实战案例(CSS基本用法、CSS层叠性、CSS继承性)

    CSS3基础——笔记 CSS是Cascading Style Sheet的缩写,翻译为"层叠样式表" 或 "级联样式表".CSS定义如何显示HTML的标签央视, ...

  6. Tridiv：基于 Web 的 CSS 编辑器，创建炫丽 3D 图形

    Tridiv 是一个基于 Web 的编辑器,使用 CSS 创建 3D 形状.它提供了一个传统的四个面板的操作界面,给出了从每个平面的视图,以及一个预览窗格中示出的最终的效果.使用 Tridiv 可以创 ...

  7. 【hadoop代码笔记】Mapreduce shuffle过程之Map输出过程

    一.概要描述 shuffle是MapReduce的一个核心过程,因此没有在前面的MapReduce作业提交的过程中描述,而是单独拿出来比较详细的描述. 根据官方的流程图示如下: 本篇文章中只是想尝试从 ...

  8. 【hadoop代码笔记】hadoop作业提交之汇总

    一.概述 在本篇博文中,试图通过代码了解hadoop job执行的整个流程.即用户提交的mapreduce的jar文件.输入提交到hadoop的集群,并在集群中运行.重点在代码的角度描述整个流程,有些 ...

  9. 【Hadoop代码笔记】目录

    整理09年时候做的Hadoop的代码笔记. 开始. [Hadoop代码笔记]Hadoop作业提交之客户端作业提交 [Hadoop代码笔记]通过JobClient对Jobtracker的调用看详细了解H ...

  10. 写给自己的web总结——css篇（1）

    上一篇写了关于html的知识,算是小试牛刀,这次来尝试写一下css. 初步了解css css的全称为cascading style sheet-- 层叠样式表,通过编入代码来对html里的标签做出各种 ...

随机推荐

  1. winform判断一个事件是否已经绑定了事件处理函数

    public static class ComponentHelper<T> where T : Control { public static bool HaveEventHandler ...

  2. Mybatis关系映射

    一.一对一关系映射 使用resultType+包装类实现 1.假设问题背景是要求在某一个购物平台的后台程序中添加一个这样的功能:查询某个订单的信息和下该订单的用户信息.首先我们可以知道,一般这样的平台 ...

  3. MFS 服务扫描与爆破

    MSF 服务发现 常用来发现局域网内,的常见服务,比如HTTP,FTP,TELNET等. MSF模块搜索: [root@localhost ~]# msfconsole msf5 > searc ...

  4. 大数据搜索引擎之elasticsearch使用篇（一）

    作者:yanzm 原文来自:https://bbs.ichunqiu.com/thread-42421-1-1.html 1.基础介绍 本期,我们将着重介绍elasticsearch的基本使用方法. ...

  5. Android OOM 引发的思考

    一.为何会出现OOM 因为Android系统的硬件资源是相当有限的,而且分配给一个应用的资源更为有限,尤其是内存.当应用突然申请的内存大于允许的最大值的时候,就会出现OOM. 如果想要获取App的内存 ...

  6. 使用 mybatis-generator 自动生成 MyBatis 代码

    首先把这三个文件放到一个目录里,我是放到了C盘下的wangbo目录下: 接下来就是设置config.xml文件了,config.xml: <?xml version="1.0" ...

  7. MySQL：事务的隔离性

    [参考文章]:数据库的事务特性及隔离级别 1. 事务的四大特性 1.1 原子性(Atomicity) 原子性是指事务包含的所有操作要么全部成功,要么全部失败回滚,因此事务的操作如果成功就必须要完全应用 ...

  8. idea : shorten command line

    [官方文档]:IntelliJ IDEA 2017.3 EAP: Configurable command line shortener and more 如果类路径太长,或者有许多VM参数,程序就无 ...

  9. Spring Boot开启的 2 种方式

    Spring Boot依赖 使用Spring Boot很简单,先添加基础依赖包,有以下两种方式 1. 继承spring-boot-starter-parent项目 <parent> < ...

  10. Python模块——HashLib与base64

    摘要算法(hashlib) Python的hashlib提供了常见的摘要算法,如MD5,SHA1等等. 什么是摘要算法呢?摘要算法又称哈希算法.散列算法.它通过一个函数,把任意长度的数据转换为一个长度 ...