WD 9. Inline&BlockElements

-
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Inline ans Block elements</title>
</head>
<body>
    <!-- 1. "p" tag send 2nd paragraph to next line as default -->
    <p style="border: 2px solid red;">This is a paragraph</p>
    <strong style="border: 2px solid red;">This is a paragraph</strong>
    <p style="border: 2px solid blue;">This is also a paragraph</p>
    <a style="border: 2px solid blue;">This is also a paragraph</a>
    <!-- 1. "span" tag send 2nd paragraph to same line as default -->
    <!-- 2. it is happened bcz "span" tag is an inline element -->
    <span style="border: 2px solid red;">This is a span</span><span style="border: 2px solid red;">This is also a span</span>
</body>
</html>
<!-- elements take up entire space are called block or block element always start from a new line-->
<!-- and elements that take only their space are called inline -->

#Output:

Comments

Post a Comment

Popular posts from this blog

JAVA Lab Programs

-
1. Calculator using switch case: import java.util.Scanner; public class Calculator{ public static void main (String[] args) { Scanner scanner = new Scanner(System. in ); System. out .println( "Calculator" ); System. out .println( "1. Addition" ); System. out .println( "2. Subtraction" ); System. out .println( "3. Multiplication" ); System. out .println( "4. Division" ); System. out .println( "5. Exit" ); System. out .println( "Enter your choice: " ); int choice = scanner.nextInt(); switch (choice){ case 1 : System. out .println( "Enter two numbers: " ); int num1 = scanner.nextInt(); int num2 = scanner.nextInt(); int sum = num1 + num2; System. out .println( "The sum is: " + sum); break ; case 2 : ...
Read more

Flutter Lab Program

-
5a1 import 'package:flutter/material.dart' ; class MyStatelessWidget extends StatelessWidget {   @override   Widget build ( BuildContext context) {     return Scaffold (       appBar : AppBar (         title : Text ( 'Stateless Widget Example' ),       ),       body : Center (         child : Text (           'Hello, Flutter!' , // In this example, MyStatelessWidget does not change after it is built. The text "Hello, Flutter!" is static.           style : TextStyle (fontSize : 24 ),         ),       ),     );   } } void main () {   runApp ( MaterialApp (     home : MyStatelessWidget (),   )); } 5a2 import 'package:flutter/material.dart' ; class MyStatefulWidget extends StatefulWidget {   @ override   _MyStatefulWidgetState createState...
Read more