HTML 样式

style属性用于改变HTML元素的样式。

<p style="font-family: arial; color: red;">字体是arial,字体颜色是红色</p>
<p style="font-size: 30px;">这行文字的字体大小是30px</p>

HTML 的 style 属性

style 属性的作用:

提供了一种改变所有 HTML 元素的样式的通用方法。

样式是 HTML 4 引入的,它是一种新的首选的改变 HTML 元素样式的方式。通过 HTML 样式,能够通过使用 style 属性直接将样式添加到 HTML 元素,或者间接地在独立的样式表中(CSS 文件)进行定义。

HTML引入样式的方式

上面只是html引入样式一种方式。其实html引入样式有三种方式。

1.外部样式表 通过<link>标签引入

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

2.内部样式表 通常写在<head>标签中

<style type="text/css">
p {
color: red;
text-align: center;
font-size: 15px;
}
</style>

3.内联样式表 通常写在相对应地元素标签的起始标签內

<p style="font-family: arial; color: red;">字体是arial,字体颜色是红色</p>
<p style="font-size: 30px;">这行文字的字体大小是30px</p>

三种方式中內联样式的优先级最高 外部样式表的优先级最低。最常用的是外部样式表,这是另一门学科CSS会在后面的博客中详细讲起。

HTML-学习笔记(样式)的更多相关文章

  1. vue学习笔记 样式 class style(五)

    使用v-bind数据绑定class和style,v-bind:class可以与传统的class属性共存,其中可以用{}设置多个class,根据条件判断的语法是class名:条件,带-的class名需要 ...

  2. Android学习笔记样式资源文件

    样式资源和主题资源都是写在styles.xml文件里面的 <style name="title"> <item name="android:textSi ...

  3. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  4. canvas学习笔记(中篇) -- canvas入门教程-- 颜色/透明度/渐变色/线宽/线条样式/虚线/文本/阴影/图片/像素处理

    [中篇] -- 建议学习时间4小时  课程共(上中下)三篇 此笔记是我初次接触canvas的时候的学习笔记,这次特意整理为博客供大家入门学习,几乎涵盖了canvas所有的基础知识,并且有众多练习案例, ...

  5. 微信小程序开发:学习笔记[4]——样式布局

    微信小程序开发:学习笔记[4]——样式布局 Flex布局 新的布局方式 在小程序开发中,我们需要考虑各种尺寸终端设备上的适配.在传统网页开发,我们用的是盒模型,通过display:inline | b ...

  6. 微信小程序开发:学习笔记[3]——WXSS样式

    微信小程序开发:学习笔记[3]——WXSS样式 快速开始 介绍 WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果. WXSS ...

  7. CSS学习笔记之样式声明

    目录 1.背景 2.文本 3.字体 4.列表 5.表格 6.轮廓 在这篇文章中你能看到有关于 CSS 样式设置的常用属性,文章的目录如下: 1.背景 (1)背景颜色 可以使用 background-c ...

  8. amazeui学习笔记--css(基本样式4)--打印样式Print

    amazeui学习笔记--css(基本样式3)--打印样式Print 一.总结 1.打印显示url方法: 利用 CSS3 content 属性,将 <a> 和 <abbr> 的 ...

  9. amazeui学习笔记--css(基本样式3)--文字排版Typography

    amazeui学习笔记--css(基本样式3)--文字排版Typography 一.总结 1.字体:amaze默认非 衬线字体(sans-serif) 2.引用块blockquote和定义列表:引用块 ...

  10. amazeui学习笔记--css(基本样式2)--基础设置Base

    amazeui学习笔记--css(基本样式2)--基础设置Base 一.总结 1.盒子模型:外margin,内padding,这里的内外指的边框 2.border-box:Amaze UI 将所有元素 ...

随机推荐

  1. WCF服务配置编辑器使用

    学习wcf,特别是初学者,配置文件很难搞懂,有点复杂,自己手动配置哪有这么多精力啊,这不是吃的太饱了吗,所以学会使用配置编辑器是必须的,下面是学习的流程图. 打开工具的wcf服务配置编辑器,点击文件= ...

  2. Android JNI 和 NDK

    1.Android NDK 一.NDK产生的背景 Android平台从诞生起,就已经支持C.C++开发.众所周知,Android的SDK基于Java实现,这意味着基于Android SDK进行开发的第 ...

  3. Android 从Gallery获取图片

    本文主要介绍Android中从Gallery获取图片 设计项目布局 <LinearLayout xmlns:android="http://schemas.android.com/ap ...

  4. IOS 四舍五入 进一法 去尾法

    float numberToRound; int result; numberToRound = 4.51; result = (int)roundf(numberToRound); NSLog(@& ...

  5. OC中的私有变量和description

    .OC中的私有变量 在类的实现即.m @implementation中也可以声明成员变量,但是因为在其他文件中通常都只 是包含头文件而不会包含实现文件,所以在.m文件中声明的成员变量是@private ...

  6. C语言的结构体和C++结构体的区别

    关于C++中声明结构体中需要使用构造器创建实例对象的语法: <C++的结构体构造方法的基本概念:结构体的构造方法需要和结构体的名字相同,并且无返回值,也不要void关键字,这样的方法就是构造器的 ...

  7. Http协议与TCP协议简单理解

    TCP协议对应于传输层,而HTTP协议对应于应用层,从本质上来说,二者没有可比性.Http协议是建立在TCP协议基础之上的,当浏览器需要从服务器获取网页数据的时候,会发出一次Http请求.Http会通 ...

  8. DFX 安全测试-- 告诉你什么是XSS、sql注入?POST和GET的区别....

    1.用户权限测试 (1) 用户权限控制 1) 用户权限控制主要是对一些有权限控制的功能进行验证 2) 用户A才能进行的操作,B是否能够进行操作(可通过窜session,将在下面介绍) 3)只能有A条件 ...

  9. js window对象

    BOM的核心对象是window,它表示浏览器的一个实例. 在浏览器中,window对象是(1)通过JavaScript访问浏览器窗口的一个接口 (2)ECMAScript规定的Global对象 1.全 ...

  10. Java基础知识学习(六)

    多线程 先了解线程的概念 多线程需要注意的地方 优先级.线程同步.消息传递.数据共享.死锁等 Java线程类 Thread,实现接口 Runnable Thread常用方法 getName 获得线程名 ...