Three ways to use CSS inline styles, embedded styles, and external reference styles
|
A simple example of how to use the three methods is as follows: Inline styles: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>css inline style</title> </head> <body> <div style="width:100px;height:100px;background:red;"></div>> </body> </html> Inline styles:
<!!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>css embedded style</title>
</head>
<body>
<style type="text/css">
#div{width:100px;height:100px;background:red;}
</style>
<div id="div"></div>>
</body>
</html>
External type: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>css embedded style</title> <link rel="stylesheet" type="text/css" href="ccss.css"> </head> <body> <div id="div"></div>> </body> </html> css file
#div{width:100px;height:100px;background:red;}
In short: Inline style: the code is written in an element on a specific web page; for example: <div style="color:#f00"></div> Inline: just write it before </head>; for example: <style type="text/css">.div{color:#F00}</style> External style: refers to an external CSS file; for example: <link href="css.css" type="text/css" rel="stylesheet" /> The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. |
<<: Detailed tutorial on installing CentOS, JDK and Hadoop on VirtualBox
>>: Newbies quickly learn the steps to create website icons
Recommend
Detailed example of MySQL (5.6 and below) parsing JSON
MySQL (5.6 and below) parses json #json parsing f...
Linux uses binary mode to install mysql
This article shares the specific steps of install...
Summary of Linux user groups and permissions
User Groups In Linux, every user must belong to a...
Several ways to easily traverse object properties in JS
Table of contents 1. Self-enumerable properties 2...
Solution to the failure of 6ull to load the Linux driver module
Table of contents 0x01 Failed to load the driver ...
Five practical tips for web form design
1. Mobile selection of form text input: In the te...
Vue implements adding, displaying and deleting multiple images
This article shares the specific code for Vue to ...
Vue+js realizes video fade-in and fade-out effect
Vue+js realizes the fade in and fade out of the v...
Detailed explanation of the deployment process of SEATA transaction service Docker
1. Create a database authorization statement >...
Compatibility issues when inserting audio files in HTML and playing them in browsers
Let's talk about some problems I have encounte...
MySQL series 9 MySQL query cache and index
Table of contents Tutorial Series 1. MySQL Archit...
Implementation of Nginx operation response header information
Prerequisite: You need to compile the ngx_http_he...
Sliding menu implemented with CSS3
Result:Implementation code: <!DOCTYPE html>...
React concurrent function experience (front-end concurrent mode)
React is an open-source JavaScript library used b...
Detailed explanation of Navicat's slow remote connection to MySQL
The final solution is in the last picture If you ...