css设计引言,HTML5与CSS3设计模式 引言(3)

2023-11-15

引言(3)

2. 代码清单2. 浮动下沉首字示例

HTML〈pclass="hanging-indent"〉

〈spanclass="hanging-dropcap"〉H〈/span〉anging Dropcap.

〈/p〉

CSS.hanging-indent { padding-left:50px; text-indent:-50px; margin-top:-25px; }

.hanging-dropcap { position:relative; top:0.55em; left:-3px; font-size:60px;

line-height:60px;}

本书约定

本书中每一个设计模式都采用以下约定。

所有大写符号都必须用实际值替换。(注意:代码清单1的大写符号在代码清单2中都被替换为了具体的值。)

大写的元素必须相应地替换成所选择的元素。除非确定修改后仍然能产生相同的框模型,否则不要修改写元素名。下面是常用的元素占位符。

ELEMENT 表示任意类型的元素。

INLINE 表示行内元素。

INLINE_TEXT 表示〈span〉、〈em〉或〈code〉等包含文件内容的行内元素。

BLOCK 表示块级元素。

TERMINAL_BLOCK 表示终止块元素。

INLINE_BLOCK 表示行内块级元素。

HEADING 表示〈h1〉、〈h2〉、〈h3〉、〈h4〉、〈h5〉和〈h6〉。

PARENT 表示可作为子元素有效父级的元素。

CHILD 表示可以作为父级元素有效子级的元素。

LIST 表示任意的列表元素,包括〈ol〉、〈ul〉和〈dl〉。

LIST_ITEM 表示列表项,包括〈li〉、〈dd〉和〈dt〉。

需要替换的选择器也是大写的。除非是同时对HTML模式进行了修改(如修改了类名),否则不要修改选择器中的小写符号。下面是常用的占位符。

SELECTOR {} 表示任意的选择器。

INLINE_SELECTOR {} 表示用于选择行内元素的选择器。

INLINE_BLOCK_SELECTOR {} 表示用于选择行内块级元素的选择器。

BLOCK_SELECTOR {} 表示用于选择块级元素的选择器。

TERMINAL_BLOCK_SELECTOR {} 表示用于选择终止块元素的选择器。

SIZED_BLOCK_SELECTOR {} 表示用于选择设定尺寸块元素的选择器。

TABLE_SELECTOR {} 表示用于选择表格元素的选择器。

CELL_SELECTOR {} 表示用于选择表格单元格元素的选择器。

PARENT_SELECTOR {} 表示用于选择设计模式中父级元素的选择器。

SIBLING_SELECTOR {} 表示用于选择模式中子元素的选择器。

TYPE {} 表示一种按类型(如h1或span)选择元素的选择器。

*.CLASS {} 表示按类名选择元素的选择器。

#ID {} 表示按ID进行选择的元素选择器。

所有需要替换的值都用大写符号表示。如果一个值包含小写符号,那么不要修改这部分值。下面是常用的值占位符。

一些值是字面值,不需要替换,如0、-9999px、1px、1em、none、absolute、relative和auto。这些值总是小写的。

+VALUE 表示大于或等于0的非负度量值,如0、10px或2em。

-VALUE 表示小于或等于0的非正度量值,如0、-10px或-2em。

±VALUE 表示任意度量值。

VALUEem 表示em度量值。

VALUEpx 表示像素度量值。

VALUE% 表示百分数比度量值。

VALUE_OR_PERCENT 表示一个度量值或百分比值。

WIDTH STYLE COLOR 表示多个属性值,如border值。每一个值都用大写符号表示。

url("FILE.EXT") 表示背景图像,请将FILE.EXT替换为图像的URL。

CONSTANT 表示有效的常量值。例如,white-space支持3个常量值:normal、pre和

nowrap。为了方便起见,我们通常用大写字母列举有效的常量值,每个值之间用下划线连接,如NORMAL_PRE_NOWRAP。

【责任编辑:book TEL:(010)68476606】

点赞 0

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

css设计引言,HTML5与CSS3设计模式 引言(3) 的相关文章

  • 【流媒體】jrtplib—VS2010下RTP开源协议库JRTPLIB3.9.1编译

    流媒體 jrtplib VS2010下RTP开源协议库JRTPLIB3 9 1编译 SkySeraph Apr 7th 2012 Email skyseraph00 163 com 一 JRTPLIB简介 老外用C 编写的开源RTP协议库
  • matlab、C语言实现时域卷积运算

    背景 某次面试 岗位为音频算法 遇到了c语言实现卷积的编程题 当时不够精通c语言 写的程序比较垃圾 现在重新整理了一下 原理 卷积公式 matlab有自带的计算卷积的函数conv 根据公式 现编写实现卷积的函数并与自带函数做对比 关键点 假
  • 初步C++: g++: error: CreateProcess: No such file or directory

    问题 使用eclipse 环境 学习 c 出现如下错误 g error CreateProcess No such file or directory 经过百度查找 花了接近一天时间 始终找不到问题原因 今天下午出去上完 英语课回来的时候
  • 07-Java框架-SpringBoot整合MyBatis

    一 SpringBoot整合mybatis 1 1 添加依赖 创建springboot项目 添加依赖 编写启动类等 并在springboot依赖的基础上加入 mysql 和 springboot整合mybatis 的依赖 依赖对应关系参考官
  • Proxyee Down百度网盘高速下载器详细使用教程

    之前的Mac介绍毒了很多关于百度云提速的文章 但随着时间的推移 也都一一失效 今天再为大家带来一款百度云提速神器Proxyee Down 测试可以正常使用 速度也是非常的快 但不能保证所有资源下载正常 下面为大家整理详细的教程 希望大家可以
  • 更改jar包里的代码

    1 将class文件改成java文件 如果你的jar包中是包含源代码的 即包含java文件 请跳过此步 先将jar包通过winrar或者快压等解压缩软件将jar包解压缩 再通过一些专门的Java反编译工具将class文件转换为java文件
  • 如何将Android studio 的项目变成Lib工程,供项目使用

    最近公司项目比较松 在这里我优化项目时 突然想到就写一下关于项目怎么搞成lib包来给其他项目引用的过程 下面就是所有的步骤 说得很详细呢 1 先创建一个PersonLibDemo的一个Android项目 在这个项目创建一个类 方便测试在别
  • C#读写欧姆龙PLC数据omron 使用TCP/IP FINS协议

    很多自动化设备使用OMRON PLC来控制制造过程 如果有SCADA 数据系统需要获取PLC的数据 甚至控制制造过程的参数 如加热温度 切割长度等 这需要一个中间层来执行这个任务 这个类就是为这种需求而设计的 可以把它嵌入到你的应用中 让你
  • 计算机磁盘组织选项,电脑d盘怎么清理 选择常规选项然后点击磁盘清

    谈论到电脑 大家应该都了解 有人问电脑d盘如果满了怎么办 当然了 还有人想问电脑d盘满了 怎么清理 这到底怎么回事呢 事实上电脑里面的d盘怎么没有了呢 下面小编就会给大家带来电脑d盘怎么清理 下面就和大家分享一下吧 电脑d盘怎么清理 具体操
  • PageHelper.startPage的使用

    PageHelper startPage的使用 PageHelper是MyBatis的分页插件 它能够帮助我们快速且简洁的实现分页功能 传统的分页都需要我们程序员手动在sql语句里写LIMIT语句 而PageHelper这个插件能够帮助我们
  • 时序预测

    时序预测 MATLAB实现基于EMD LSTM时间序列预测 EMD分解结合LSTM长短期记忆神经网络 目录 时序预测 MATLAB实现基于EMD LSTM时间序列预测 EMD分解结合LSTM长短期记忆神经网络 效果一览 基本描述 模型描述
  • python 情感分析实例_基于Python的情感分析案例

    情感分析 又称为倾向性分析和意见挖掘 它是对带有情感色彩的主观性文本进行分析 处理 归纳和推理的过程 其中情感分析还可以细分为情感极性 倾向 分析 情感程度分析 主客观分析等 情感极性分析的目的是对文本进行褒义 贬义 中性的判 情感分析 又
  • 某互联网公司前端JS代码规范

    JavaScript编程规范 1 概述 目的 规范开发部员工在项目开发过程中的JavaScript编码 进而提高系统性能及代码的可读性 降低维护的难度 适用范围 使用JavaScript语言开发的所有人员 2 排版规范 1 程序块采用缩进风
  • linux pm2功能说明,PM2命令使用方法介绍

    PM2是具有内置负载平衡器的Node js应用程序的生产过程管理器 它使您可以永久保持应用程序的活动状态 无需停机即可重新加载应用程序 并且可以方便常见的系统管理任务 在生产模式下启动应用程序非常简单 pm2 start app js 官方
  • 动态规划法(JavaScript)

    目录 一 动态规划 二 性质 三 典型问题 四 求解的基本步骤 五 案例 1 爬梯子问题 2 最大和的连续子数组 一 动态规划 动态规划 简称DP 的思想是把一个大的问题进行拆分 细分成一个个小的子问题 且能够从这些小的子问题的解当中推导出
  • EasyExcel多数据导出到多Sheet工作表,以及常用配置

    一 EasyExcel多数据导出到多Sheet工作表 outputStream response getOutputStream 创建ExcelWriter对象 com alibaba excel ExcelWriter writer Ea
  • Android 11.0Launcher3 app列表页桌面图标按安装时间排序

    目录 1 概述 2 Launcher3 app列表页桌面图标按安装时间排序的相关代码
  • @SpringBootTest单元测试测试类的使用

    前言 使用SpringBoot 测试类可在不需要启动程序时 即可使用 当你运行你的测试方法时他会自己启动程序调用所需使用到的mapper service接口 实现方法 故而可在测试类中像编写正常service方法一样编写代码 一 依赖录入
  • 实用工具

    JSONView是一款非常实用的JSON数据格式化和语法高亮扩展程序 官网地址 https jsonview com 可以访问JSONView测试地址 https jsonview com example json 感受一下扩展程序的魅力

随机推荐

  • xp系统怎么保存服务器密码,xp系统ftp服务器密码

    xp系统ftp服务器密码 内容精选 换一换 登录Windows操作系统的弹性云服务器时 需使用密码方式登录 因此 用户需先根据创建弹性云服务器时使用的密钥文件 获取该弹性云服务器初始安装时系统生成的管理员密码 Administrator帐户
  • 写给小白的常见三种加密方式:MD5,对称非对称加密

    我们在做数据类传输产品或测试的过程中 总会听到开发说数据要加密 然后使用各种加密方式 那么希望通过本文 能够让大家对一些常见的加密方式有一些更加深入的了解 理解其中的底层逻辑 今天介绍三种常见的加密方式 MD5加密 对称加密 非对称加密 1
  • CTF签到题

    提示输入口令zhimakaimen 但是查看源代码发现输入框对长度有限制 最长只能输入10位 使用firefox插件firebug chrome控制台可直接对manlength值进行修改 改为大于11 即可输入 也可以使用burpsuite
  • Nginx常用命令以及升级(window)

    nginx Windows作为标准控制台应用程序 不是服务 运行 可以使用以下命令对其进行管理 start nginx 启动Nginx nginx s stop fast shutdown 快速停止 nginx s quit gracefu
  • 基础css-flex布局基础属性

    1 flex布局 弹性布局 伸缩布局 设置当前盒子为弹性盒子 display flex 设置主轴方向的对齐方式 justify content justify content center 设置侧轴方向的对齐方式 align items a
  • replace(),IndexOf(),substring() ,lastIndexOf() ,split() ,pollFirst() ,pollFirst()

    replace pattern replacement 使用replacement替换pattern 如果pattern是字符串只替换第一个匹配项 如果pattern是正则表达式则替换每次匹配都要调用的回调函数 实例 String a 1
  • win10 系统开启自带热点,手机无法连接(连接超时)

    win10开始自带热点 手机成功连接 颇费周折 所以在此记录一下 也给其他人一个参考 今天想在win10上安装个WIFI软件 好让手机连接 结果无意间发现win10自带了热点功能 于是赶紧打开 手机的WIFI列表也显示出来了 本以为就这样愉
  • 国际MES供应商与产品大全

    最近花了一点时间 将国际上知名的MES厂商和其产品整理了一下 如下 ABB ABB 苏黎世 瑞士 是一个240亿美元的自动化和电力技术的全球业务的供应商 它的制造软件利用其控制及自动化产品通用解决方案的一部分 其系统800xa控制体系结构
  • Android 自定义播放暂停按钮图片

    Android 自定义播放暂停按钮图片 在开发Android应用程序时 我们经常需要使用播放暂停按钮来控制媒体播放器的状态 虽然Android提供了默认的播放暂停按钮 但有时候我们希望根据设计需求自定义这些按钮的外观 在本文中 我将详细介绍
  • 嵌入式毕设分享 自动晾衣架设计与实现(源码+硬件+论文)

    文章目录 0 前言 1 主要功能 2 硬件设计 原理图 3 核心软件设计 4 实现效果 5 最后 0 前言 这两年开始毕业设计和毕业答辩的要求和难度不断提升 传统的毕设题目缺少创新和亮点 往往达不到毕业答辩的要求 这两年不断有学弟学妹告诉学
  • 解决tmux启动「can't create socket」的问题

    Tmux是终端重度用户的好帮手 你再也不用担心以下问题 任务运行一半要下班 发现忘记使用nohup 网络不稳定 终端会掉线 有人找我开会 切换有线 无线会掉线 我入职以后 一直在开发机里面使用tmux和screen 在我发现tmux之前 最
  • Java的循环

    目录 1 while循环 2 do while循环 3 for 循环 1 while循环 while循环结构 语法结构 初始值 while 条件 循环操作代码块 迭代代码 执行规律 1 首先执行一次初始值 2 然后判断条件 如果条件为tru
  • ESP32的WIFI的STA模式&调控ESP32蓝牙和WIFI发射功率

    以下相关API接口的定义可进入l乐鑫官方查看 Wi Fi 库 ESP32 ESP IDF 编程指南 v4 4 文档 STA模式配置过程 include
  • springboot 获取当前日期_Spring Boot获取时间

    运行环境新建测试类 package com wusiyao websockets service import org springframework stereotype Service import java text SimpleDa
  • 【Linux后端服务器开发】常用开发工具

    目录 一 apt yum 二 gcc g 三 make makefile 四 vi vim 五 gdb 一 apt yum apt 和 yum 都是在Linux环境下的软件包管理器 负责软件的查找 安装 更新与卸载 apt 是Ubuntu系
  • 小程序经典案例

    1 上拉触底事件 data colorList isloding false getColors this setData isloding true 需要展示 loading 效果 wx showLoading title 数据加载中 w
  • Java学习笔记 03

    相关文章 Java学习笔记 01 概论 Java学习笔记 02 快速之旅 Java环境配置及HelloWorld程序 引言 写这篇文章 主要是为了以后能快速复习Java的基础语法 同时 帮助有C 等语言基础的同学快速入门Java 目录 一
  • SmartFusion从FPGA到ARM系列教程

    前言 本系列教程 将会以Microsemi SmartFusion一代芯片A2F200M3F为例 简单介绍片上ARM Cortex M3 硬核 MCU 基本外设的使用 及其与FPGA逻辑模块进行交互的示例 在学习片上硬核ARM Cortex
  • 网上阅卷系统php源码,又开源了,网上阅卷系统自动识别功能代码

    想让自己轻松点就要让计算机多为你做点 前几天一个朋友找到我让我做一个网上阅卷系统 就是实现这么几个功能 高速扫描仪扫描试卷后得到一张一张的图片 软件的功能就是处理图片 计算成绩 再详细点就是自动识别考生涂的学号 自动识别考生的选择题答案并记
  • css设计引言,HTML5与CSS3设计模式 引言(3)

    引言 3 2 代码清单2 浮动下沉首字示例 HTML pclass hanging indent spanclass hanging dropcap H span anging Dropcap p CSS hanging indent pa