Update pages/introds.py

pages/introds.py

@@ -1,3 +1,87 @@
 import streamlit
 import pandas
-import numpy 
+import numpy 
+st.markdown("<h1 style='text-align: center; color: Balck;'>Introduction To Data Science</h1>", unsafe_allow_html=True)
+st.markdown("<h2 style='color: Black;'>CSS background </h2>", unsafe_allow_html=True)
+st.markdown(
+    "<p style='font-size: 16px; color: Blue; font-style: italic;'>"
+
+# CSS for styling with the background image
+custom_css = """
+<style>
+/* General styling for the image */
+.styled-image {
+    max-width: 100%; /* Ensure the image is responsive */
+    height: auto; /* Maintain aspect ratio */
+    border-radius: 15px; /* Rounded corners */
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
+    border: 5px solid #ffffff; /* Optional border with white color */
+    transition: transform 0.3s ease, box-shadow 0.3s ease; /* Smooth transitions */
+}
+
+/* Hover effect */
+.styled-image:hover {
+    transform: scale(1.05); /* Slight zoom effect */
+    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); /* Enhanced shadow on hover */
+    border-color: #4caf50; /* Change border color on hover */
+}
+
+/* Caption styling */
+.image-container {
+    text-align: center;
+    margin: 20px 0;
+}
+
+.image-caption {
+    margin-top: 10px;
+    font-size: 1rem; /* Adjust font size */
+    color: #555; /* Gray color for caption text */
+    font-style: italic;
+}
+</style>
+"""
+# Apply custom CSS
+st.markdown(custom_css, unsafe_allow_html=True)
+# Page Title
+st.markdown("<h1> Data science </h1>", unsafe_allow_html=True)
+# Section: What is Data Science?
+st.markdown("""
+<div class="section">
+    <h2>What is Data Science? </h2>
+    <p>
+       It combines techniques from statistics, computer science, mathematics, and domain expertise to analyze and interpret data effectively.
+       In essence, data science transforms raw data into actionable insights, driving smarter decisions across industries.
+        There are some several types of explanations which are given below :
+     </p>
+    <ul>
+        <li>Analyzing customer reviews to identify product sentiment</li> 
+          <li>Techniques Used: Natural Language Processing (NLP), sentiment analysis.</li>
+        
+        <li>Optimizing delivery routes for logistics companies</li>
+              <li>Techniques Used: Graph algorithms, optimization techniques </li>
+    </ul>
+</div>
+<div class="section">
+    <h2>Few Important steps in DS </h2>
+    <p>
+        Data Science has several steps ,such as :
+    </p>
+    <ul>    
+         <li><strong>Understanding the given problem:</strong>First thing is you need to understand the given type of problem</li>
+         <li><strong>Data Collection:</strong> Gather relevant data from various sources to address the defined problem.</li>
+         <li><strong>Data Cleaning and Preprocessing: </strong> Prepare the raw data for analysis by handling inconsistencies, missing values, and errors. </li>
+         <li><strong>Exploratory Data Analysis (EDA):</strong>Gain an initial understanding of the data’s main characteristics through visualization and summary statistics.</li>
+         <li><strong> Deployment: </strong Implement the model into a production environment where it can provide actionable insights or make decisions in real-time.> </li>
+       </ul>
+</div>
+""", unsafe_allow_html=True)
+
+
+
+
+
+
+
+
+
+