其实在写这篇博客的时候已经学了很久，也写了不少代码，特别是很枯燥的看完整个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. SDUT OJ 3403 数据结构实验之排序六：希尔排序

    数据结构实验之排序六:希尔排序 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Discuss Problem Descrip ...

  2. selenium定位不到元素

    selenium定位不到元素时,网上大部分查到都是iFrame的切换问题,然后是多窗口.句柄的处理问题, 在初学是遇到定位不到元素,一直在找上面的问题,发现都不是上面的问题, 后来才发现是页面刷新的问 ...

  3. Android 对话框的应用1

    1.介绍 2.作用 (1)消息提示对话框 (2)简单列表对话框 (3)单选列表对话框 (4)多选对话框 (5)自定义对话框 3.java后台代码 package com.lucky.test28dia ...

  4. python学习，day1：循环判断基本语句的几个代码

    # coding=utf-8 # Author: RyAn Bi count = 0 '''while True : print('count:',count) count = count + 1 i ...

  5. Python之逻辑运算符

    这一小节我在动笔之前犹豫到底要不要动手写,虽然简单但是防止遗忘,博主还是决定记录一下.Python中运算符主要分为算术运算符,赋值运算符,比较运算符,逻辑运算符以及成员运算符.下面详细记录这5种运算符 ...

  6. Python-删除列表中重复元素的方法

    1.set()方法 x = [1,2,3,4,5,1] y = list(set(x)) print(y) ``` [1, 2, 3, 4, 5] ``` 2. x = ['b','c','d','b ...

  7. linux命令eval的用法

    [转自]http://blog.chinaunix.net/uid-21411227-id-1826706.html 1. eval command-line 其中command-line是在终端上键 ...

  8. Linux mysql中文乱码问题

    1.debian系统 (1)mysql 5.5版本之前 vim /etc/mysql/my.cnf 在  [client]  下面加入 default-character-set=utf8 在  [m ...

  9. 剑指offer——面试题9：用两个栈实现队列

    #include "Queue.h" // ====================测试代码==================== void Test(char actual, ...

  10. vim的多窗口功能与环境参数设置

    Vim的多窗口功能 多窗口情况下按键功能 :sp [filename] 打开一个新的窗口,如果有加filename,表示在新窗口打开一个新文件,否则表示两个窗口为同一文件内容 :[ctrl]+w+j( ...