CSS样式表定义

CSS样式表定义一个JSP页面是通过在HTML标签的基础上嵌入JSP动作和指令、CSS、Java变量和方法(Java代码段)、其他脚本元素(如JavaScript)等组成的。

大家好,又见面了,我是你们的朋友全栈君。

在网页制作过程中,定义样式表的方法主要有下面三种。

1.通过HTML标签定义样式表
CSS样式表的基本语法如下:

引用样式的对象{标签属性:属性值;标签属性:属性值;…}

(1)引用样式的对象:指的是需要引用该样式的HTML标签,可以是一个或多个标签,需要注意的是,这里使用的是去掉尖括号的标签名。例如,p、table等,而不是<p>、<table>。
(2)标签属性:属性值——这是一一对应的,每个属性与属性值对之间用分号隔开。要说明的是,CSS的属性设置与脚本语言的属性设置有一点不同,即属性名称的写法不同。在CSS中,凡属性名为两个或两个以上的单词构成时,单词之间以“-”隔开,如背景颜色属性background-color。
例如,“< h1>< /h1>标签和< h2>< /h2>标签内的文本居中显示,并采用蓝色字体”的样式表为:

 h1,h2{text-align:center;color:bule}

2.使用id定义样式表
在HTML页面中,id选择符用来对某一单一元素定义单独的样式,定义id选择符要在id名称前加上一个#号。使用id定义样式表的基本语法如下:

id名称{标签属性:属性值;标签属性:属性值;…}

使用时只需将要用该样式的网页内容前加一个id=“id名称”。例如:

#sample{font-family:宋体;font-size:60pt}
<p id = sample>段落文本</p>

3.使用class定义样式表
若要为同一元素创建不同的样式或为不同元素创建相同的样式,可以使用CSS类。CSS类有两种定义格式,定义时,在自定义类的名称前面加一个点号。

标签名.类名{标签属性:属性值;标签属性:属性值;…}

这种格式的类指明所定义的样式只能用在类名前所指定的标签上。例如:

h1.center{text-align:center}

该center类的样式只能用在< h1>标签上。

.类名{标签属性:属性值;标签属性:属性值;…}

这种格式的类使所有class属性值为该类名的标签都遵循该类所定义的样式。例如:

.text{font-family:宋体;color:red;}
<p class = "text">段落文本</p>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158955.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 手撕包菜_handlecpuacceleration

    手撕包菜_handlecpuaccelerationLinkedHashSet能够维护元素插入集合的顺序,在遍历时,按照此顺序进行遍历。LinkedHashSet继承了HashSet类,实现了Set等接口。LinkedHashSet仍然支持null元素,唯一有所区别的是在迭代时,它能够按照元素的插入顺序遍历。LinkedHashSet的实现非常简单,它仅仅只重新实现了构造方法,将HashSet内部维护的HashMap…

    2022年10月12日
    4
  • tomcat docbase(fpga版本管理)

    TOMCAT的配置文件Server.XML里有一句:指定应用目录,其他参数先不说,聊聊appBase。1、appBase=”webapps“,这是默认值,代表:d:\tomcat\webapps这样的路径,谓之根目录;根目录下的ROOT目录,代表默认的主目录。访问:http://localhost:8080默认找d:\tomcat\webapps\ROOT下的文件(前提是没有d…

    2022年4月18日
    41
  • flutter属于前端还是后端(kotlin比较flutter)

    尝试了网上多种库和教程都没办法互解,JAVA代码如下,求个大佬帮忙用dart(Flutter)实现一个可以互解的aes加密代码packagecom.example.lib;importjavax.crypto.Cipher;importjavax.crypto.spec.IvParameterSpec;importjavax.crypto.spec.SecretKeySpec;public…

    2022年4月9日
    255
  • 请你用三角形和平行四边形设计一个漂亮的图案(圆形和正方形组合图形)

    一共收集整理了图形20个,比较实用,同时也为了熟悉CSS的代码。整合了一下,有错误欢迎指出。1.正方形650)this.width=650;”alt=””border=”0″src=”http://www.meilizhuo.com/uploads/allimg/141105/09101KE1-0.png”style=”border:0px;”/>#square{width:100

    2022年4月10日
    358
  • MATLAB 处理大数据

    MATLAB 处理大数据如何处理大规模的快数据集大数据指的是创建的数据和供分析的数据的数量与速率迅速增加。此趋势的主要驱动因素是不断增加的信息数字化。采集设备的数量和类型以及其他数据生成机制无时无刻不在增加。大数据源包括来自仪表传感器、卫星和医疗图像的流数据,来自安全摄像机的视频以及派生自金融市场和零售运营的数据。上述来源的大数据集可以包含千兆字节或百万兆字节的数据,并且每天以兆字节或千兆字节的级别增长。

    2022年5月23日
    140
  • 自定义单选框样式方法

    自定义单选框样式方法元素的初始样式都不怎么好看,我们一般修改样式会想到直接在那元素上添加样式,比如background、border等,在大多数元素上是可以这么做,但当遇上了单选框会毫无反应。例:&amp;lt;!DOCTYPEhtml&amp;gt;&amp;lt;htmllang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt;&amp;lt;metacharset=&quot;UTF

    2022年5月25日
    46

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号