一，效果图。

二，代码。

<!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. MyBatis 源码分析 - SQL 的执行过程

    * 本文速览 本篇文章较为详细的介绍了 MyBatis 执行 SQL 的过程.该过程本身比较复杂,牵涉到的技术点比较多.包括但不限于 Mapper 接口代理类的生成.接口方法的解析.SQL 语句的解析 ...

  2. 从文本中读取字符——feof函数问题

    feof()函数 函数原型:int feof(FILE *fp): 函数功能:检测流上的文件结束符,如果文件结束,则返回非0值,否则返回0,文件结束符只能被clearerr()函数清除 (函数feof ...

  3. JS应用实例2：轮播图

    在学习轮播图之前,要先会切换图片: 找三张图片,命名1.jpg,2.jpg,3.jpg 示例: <!DOCTYPE html> <html> <head> < ...

  4. Java架构技术进阶之：从分布式到微服务，深挖Service Mesh

    自从几十年前第一次引入分布式系统这个概念以来,出现了很多原来根本想象不到的分布式系统使用案例,但同时也引入了各种各样的新问题. 当这些系统还是比较少比较简单的时候,工程师可以通过减少远程交互的次数来解 ...

  5. linux中变量的一些操作方法

    常见的一般有如下操作,可以对字符串进行简单操作: echo ${#var}打印变量var长度 echo "$var:3:8" 打印变量var第4个字符开始的8个字符echo ${v ...

  6. 如何把开源项目发布到Jcenter

    转载自:https://www.jianshu.com/p/f66972f0607a 首先我们应该注册一个JFrog Bintray的账号 Jfrog Bintray官网 这里我们可以注意到那个绿色的 ...

  7. 【OSX】解决编译AOSP时需要10.5/10.6 SDK下载

    有人遇到的是需要10.6的sdk. 公司网快下载了xcode, 把里面的10.5sdk和10.6sdk拿出来, 一共才一百多兆…… 下载链接: http://pan.baidu.com/s/1gdxG ...

  8. Apache Commons Digester 二（规则模块绑定-RulesModule、异步解析-asyncParse、xml变量Substitutor、带参构造方法）

    前言 上一篇对Digester做了基本介绍,也已经了解了Digester的基本使用方法,接下来将继续学习其相关特性,本篇主要涉及以下几个内容: 规则模块绑定,通过定义一个RulesModule接口实现 ...

  9. ConfigUtil读取配置文件工具类

    ConfigUtil package com.sso.util; import java.io.FileNotFoundException; import java.io.IOException; i ...

  10. 通过spring抽象路由数据源+MyBatis拦截器实现数据库自动读写分离

    前言 之前使用的读写分离的方案是在mybatis中配置两个数据源,然后生成两个不同的SqlSessionTemplate然后手动去识别执行sql语句是操作主库还是从库.如下图所示: 好处是,你可以人为 ...