CSS — 内部样式几种常用写法(类、id)

效果图:
CSS — 内部样式几种常用写法(类、id)_第1张图片

一丶类


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Documenttitle>
	<style type="text/css" media="screen">
		.p1{
      
			color: red;
			size: 20px
		}
		.r1{
      
			color: red;
			size: 20px
		}
		.p2{
      
			color: red;
			size: 20px
		}
	
	style>
head>
<body>

	<h1>本周末任务计划h1>
	<ul class="p1">
		<li>去书店买书li>
		<li>去逛街,给爸爸妈妈买新衣服li>
		<li>周六早上9点去见客户li>
		<li>周日带着乐乐去去公园画画li>
	ul>

	<h1>老哥排行榜h1>
	<ul class="r1">
		<li>海阔天空li>
		<li>甜蜜蜜li>
		<li>一路上有你li>
		<li>我是一只小小鸟li>
	ul>

	<h1>友情链接h1>
	<ul class="p2">
		<li>购书指南li>
		<li>账户管理li>
		<li>配送方式li>
	ul>


body>
html>

二丶 id


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>Documenttitle>
	<style type="text/css" media="screen">
		#p1{
      
			color: red;
			size: 20px
		}

		#r1{
      
			color: #0DFC8B;
			size: 20px
		}
		#p2{
      
			color: #F806D8;
		}
	style>
head>
<body>

	<h1>本周末任务计划h1>
	<ul id="p1">
		<li>去书店买书li>
		<li>去逛街,给爸爸妈妈买新衣服li>
		<li>周六早上9点去见客户li>
		<li>周日带着乐乐去去公园画画li>
	ul>

	<h1>老哥排行榜h1>
	<ul id="r1">
		<li>海阔天空li>
		<li>甜蜜蜜li>
		<li>一路上有你li>
		<li>我是一只小小鸟li>
	ul>

	<h1>友情链接h1>
	<ul id="p2">
		<li>购书指南li>
		<li>账户管理li>
		<li>配送方式li>
	ul>


body>
html>

你可能感兴趣的:(前端,CSS,Web,内部样式,类,id)