其实在写这篇博客的时候已经学了很久，也写了不少代码，特别是很枯燥的看完整个html部分，因为不带有CSS写出来的东西干巴巴的一点也不好看。

直到展开CSS学习才开来补上博客，嗯，这是个好习惯。

这是运行后的效果。

文字同样，在百度瞎几把copy的。

<body>

    <h1>h1 Management Team</h1>

    <h2>h2 Introducing Java SE 11</h2>

    <p class="intro">P(intro) The <a class="breed" target="_blank" href="https://www.oracle.com/technetwork/java/javase/downloads/index.html">A DOWNLOAD JAVA 11</a>

    ,How time flies!  Over the last several months,

     Oracle announced changes to evolve the Java platform ensuring

     it continues forward with a vibrant future for users.

      Those advances included:</p>

      <h3>h3 Introducing the Java SE Subscription</h3>

      <p class="intro2">

        P(intro2) Oracle announced the Java SE Subscription over the summer,

        a new model that covers all Java SE licensing and support

        needs to further support for the millions of worldwide businesses

         running Java in production. The subscription complements the

         long-standing free Oracle OpenJDK offering, which enables

         developers and organizations that do not need commercial support.

      </p>

      <p class="credits">P(credits) by ShiFu</p>

</body>

那个链接是下载java的链接，因为当初知道甲骨文的官网是全英文，故意进去copy的。
当然，这里HTML只附有主代码。

body{

    padding: 50px;

}

h1,h2,h3,a{

    font-weight: normal;

    color:#0088dd;

    margin:0px;

}

h1{

    font-family: "华文行楷",Georgia,Times,serif;

    font-size: 250%;

    text-shadow: 5px 5px 20px #666666;

    padding-bottom: 20px;

}

h2{

    font-family:"Gill Sans",Arial, sans-serif;

    font-size: 90%;

    text-transform: uppercase;/*转换为大写*/

    letter-spacing: 0.2em;

}

h3{

    font-size: 150%;

}

p{

    font-family:Arial, Verdana, sans-serif;

    line-height: 1.4em;

    color: #665544;

}

p.intro::first-line{

    font-weight: bold;

}

.credits{

    font-style: italic;

    text-align:right;

}

a{

    text-decoration: none;

}

a:hover{

    text-decoration: underline;

}

CSS则是全部代码，实实在在学到这个地步才知道HTML&CSS脚本语言是有多简单。特别是CSS，简直就是说明补丁123。
首先是html关联CSS文件，特别简单：

版权归作者所有，任何形式转载请联系作者。
作者：云端与海底（来自豆瓣）
来源：https://book.douban.com/review/7736617/

基本选择器
通用选择器＊｛｝匹配所有元素
类型选择器p｛｝匹配某一类型元素
类选择器.class｛｝匹配class属性相同的元素
ID选择器＃id｛｝匹配id属性相同的元素
子元素选择器p>a｛｝匹配指定元素的直接子元素
后代选择器p a｛｝匹配指定元素的后代元素
相邻兄弟选择器h1+p｛｝匹配指定元素的下一个元素
普通兄弟选择器h1～p｛｝匹配指定元素的下一类元素
－特性选择器
简单选择器p［class］匹配一种具有特定属性的元素
精确选择器p［class＝“css”］匹配一个具有特定属性值的元素，该属性值唯一
部分选择器p［class～＝“css”］匹配一个具有特定属性值的元素，该属性值不唯一
开头选择器p［attr^=“c”］匹配一个具有特定属性值的元素，该属性值以某字符串开头
包含选择器p［attr*=“css”］匹配一个具有特定属性值的元素，该属性值包含某字符串
结尾选择器p［attr$=“s”］匹配一个具有特定属性值的元素，该属性值以某字符串结尾

【HTML&CSS】文本的基本处理的更多相关文章

  1. 第 15 章 CSS 文本样式[下]

    学习要点: 1.文本总汇 2.文本样式 3.文本控制 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．文本总汇 本节课, ...

  2. 第 15 章 CSS 文本样式[上]

    学习要点: 1.字体总汇 2.字体设置 3.Web 字体 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．字体总汇 本节 ...

  3. css文本格式详解

    一.css文本主体内容: 二.css文本详解:  1.文本缩进 语法: text-indent:<length>|<percentage> 默认值为0. 属性值详解: < ...

  4. CSS文本与连接

    CSS文本 CSS文本属性可以定义文本外观,通过文本属性,可以改变文本的颜色.字符间距.对齐文本.装饰文本.对文本缩进等等. 常用的文本属性 属性 描述 color 文本颜色 direction 文本 ...

  5. [CSS]文本属性（Text）

      CSS 文本属性(Text) 属性 描述 CSS color 设置文本的颜色. 1 direction 规定文本的方向 / 书写方向. 2 letter-spacing 设置字符间距. 1 lin ...

  6. CSS 文本、字体、链接

    CSS 文本属性可定义文本的外观. 通过文本属性,您可以改变文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. 缩进文本 把 Web 页面上的段落的第一行缩进,这是一种最常用的文本格式化 ...

  7. CSS文本效果

    前面的话 本文将详细介绍CSS文本效果 凸版印刷效果 这种效果尤其适用于中等亮度背景配上深色文字的场景:但它也可用于深色底.浅色字的场景,只要文字不是黑色并且背景不是纯黑或纯白就行 [浅色背景深色文本 ...

  8. CSS 文本溢出时显示省略标记

    如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...

  9. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  10. css文本属性用法总结

    稍稍总结了下css文本的一些属性用法,自己忘记的时候也可以用来查查,不用去查网站那么麻烦. 下面是部分总结,也希望对其他人有用 文本修饰 (1)text-decoration:  文本修饰(横线) 4 ...

随机推荐

  1. Spark大数据处理 之 从WordCount看Spark大数据处理的核心机制（1）

    大数据处理肯定是分布式的了,那就面临着几个核心问题:可扩展性,负载均衡,容错处理.Spark是如何处理这些问题的呢?接着上一篇的"动手写WordCount",今天要做的就是透过这个 ...

  2. Dubbo操作

    admin控制台安装 1.控制台下载地址https://github.com/apache/incubator-dubbo/releases 2.找到dubbo-admin 3.修改webapp/WE ...

  3. Linux之vi三种模式常用操作

    vi的三种模式:命令模式.编辑模式.尾行模式 一.命令模式 1.光标移动 a.字符级 左(h) 下(j) 上(k) 右(l) b.单词级 w word移动到下个单词首字母 b before上个单词首字 ...

  4. Week 5: Object Oriented Programming 9. Classes and Inheritance Exercise: int set

    class intSet(object): """An intSet is a set of integers The value is represented by a ...

  5. apache 2.4 访问权限配置

    在apache 2.4里,访问权限配置与2.2不同,如果设置不对,则会报403错误,日志中会报 AH01630: client denied by server configuration.   [S ...

  6. Spring 操作 jdbc 链接数据库

    1. 新建资源文件 db.properities jdbc.user=root jdbc.password=root jdbc.driverClass=com.mysql.jdbc.Driver jd ...

  7. AES/CBC/PKCS5Padding对称加密

    package unit; import javax.crypto.Cipher; import javax.crypto.spec.IvParameterSpec; import javax.cry ...

  8. PIE SDK位深转换

      1.算法功能简介 位深转换功能是一种用于更改一个给定输入文件数据范围的灵活方法.可以完全控制输入和输出直方图,以及输出数据类型(字节型.整型.浮点型等). PIE支持算法功能的执行,下面对位深转换 ...

  9. Blockly

    Blockly简介 A library for building visual programming editors.  Blockly 是个库,可用来构建可视化编程编辑器 Blockly is b ...

  10. GreenPlum 大数据平台--介绍

    一,GreenPlum 01,介绍: Greenplum是一种基于PostgreSQL的分布式数据库,其采用shared-nothing架构,主机.操作系统.内存.存储都是自我控制的,不存在共享. 官 ...