The document provides an overview of CSS (Cascading Style Sheets) and different methods for applying CSS styles to HTML documents, including inline styles, embedded styles, and external style sheets. It also covers various CSS selectors such as type, class, ID, descendant, and child selectors that allow targeting specific elements to which styles can be applied. Common CSS mistakes like redundant units, repetition, excessive whitespace, improper grouping, and confusion between margins and padding are also discussed.
Advanced CSS
by: Alexandra Vlachakis
Sandy Creek High School, Fayette County Schools
Slide Show correlates Georgia Deparment of Edcuation Career and Technology PATHWAY: Interactive Media
COURSE: Advanced Web Design
UNIT 6: BCS-AWD-6 Advanced CSS
Advanced CSS
by: Alexandra Vlachakis
Sandy Creek High School, Fayette County Schools
Slide Show correlates Georgia Deparment of Edcuation Career and Technology PATHWAY: Interactive Media
COURSE: Advanced Web Design
UNIT 6: BCS-AWD-6 Advanced CSS
This is part of my classroom curriculum on IBM Rational Host Access Transformation Services. More material is available from our on site classroom courseware.
Embrace the Mullet: CSS is the 'Party in the Back' (a CSS How-to)Tom Hapgood
A presentation by Tom Hapgood for WordCamp Fayetteville, in Fayetteville, AR, dealing with basic Cascading Style Sheets (CSS) in web design. CSS is likened to the "mullet," being the party in the back, with HTML as the "business in the front."
This Slide provided an introduction to CSS or Cascading Style Sheets. What is CSS? How to write styles. What are External, internal and inline CSS styles? and lot more
Act Academy provides Industrial training in PHP, .Net, graphic designing, web designing and many more. Also provides diploma courses in CAD designing, Financial accounting with 100% job assurances.
Similar to Basics Of Css And Some Common Mistakes (20)
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Ramesh Iyer
In today's fast-changing business world, Companies that adapt and embrace new ideas often need help to keep up with the competition. However, fostering a culture of innovation takes much work. It takes vision, leadership and willingness to take risks in the right proportion. Sachin Dev Duggal, co-founder of Builder.ai, has perfected the art of this balance, creating a company culture where creativity and growth are nurtured at each stage.
Let's dive deeper into the world of ODC! Ricardo Alves (OutSystems) will join us to tell all about the new Data Fabric. After that, Sezen de Bruijn (OutSystems) will get into the details on how to best design a sturdy architecture within ODC.
Neuro-symbolic is not enough, we need neuro-*semantic*Frank van Harmelen
Neuro-symbolic (NeSy) AI is on the rise. However, simply machine learning on just any symbolic structure is not sufficient to really harvest the gains of NeSy. These will only be gained when the symbolic structures have an actual semantics. I give an operational definition of semantics as “predictable inference”.
All of this illustrated with link prediction over knowledge graphs, but the argument is general.
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
PHP Frameworks: I want to break free (IPC Berlin 2024)Ralf Eggert
In this presentation, we examine the challenges and limitations of relying too heavily on PHP frameworks in web development. We discuss the history of PHP and its frameworks to understand how this dependence has evolved. The focus will be on providing concrete tips and strategies to reduce reliance on these frameworks, based on real-world examples and practical considerations. The goal is to equip developers with the skills and knowledge to create more flexible and future-proof web applications. We'll explore the importance of maintaining autonomy in a rapidly changing tech landscape and how to make informed decisions in PHP development.
This talk is aimed at encouraging a more independent approach to using PHP frameworks, moving towards a more flexible and future-proof approach to PHP development.
PHP Frameworks: I want to break free (IPC Berlin 2024)
Basics Of Css And Some Common Mistakes
1. Using the CSS Prepared by: Sanjay Raval | http:// www.usableweb.in /
2. What is CSS? CSS is a language that’s used to define the formatting applied to a Website, including colors, background images, typefaces (fonts), margins, and indentation. Let’s look at a basic example to see how this is done. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>A Simple Page</title> <style type="text/css"> h1, h2 { font-family: sans-serif; color: #3366CC; } </style> </head> <body> <h1>First Title</h1><p>…</p> <h2>Second Title</h2><p>…</p> <h2>Third Title</h2><p>…</p> </body> </html>
3.
4. Using CSS in HTML Embedded Styles In this approach, you can declare any number of CSS styles by placing them between the opening and closing <style> tags, as follows: While it’s nice and simple, the <style>tag has one major disadvantage: if you want to use a particular set of styles throughout your site, you’ll have to repeat those style definitions within the style element at the top of every one of your site’s pages. <style type="text/css"> CSS Styles here </style>
5. Using CSS in HTML External Style Sheets An external style sheet is a file (usually given a .css filename) that contains a web site’s CSS styles, keeping them separate from any one web page. Multiple pages can link to the same .css file, and any changes you make to the style definitions in that file will affect all the pages that link to it. To link a document to an external style sheet (say, styles.css), we simply place a link element in the document’s header: <link rel="stylesheet" type="text/css" href="styles.css" />
6.
7. CSS Selectors Type Selectors By naming a particular HTML element, you can apply a style rule to every occurrence of that element in the document. For example, the following style rule might be used to set the default font for a web site: p, td, th, div, dl, ul, ol { font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 1em; color: #000000; }
8. CSS Selectors Class Selectors CSS classes comes in when you want to assign different styles to identical elements that occur in different places within your document . Consider the following style, which turns all the paragraph text on a page blue: Great! But what would happen if you had a sidebar on your page with a blue background? You wouldn’t want the text in the sidebar to display in blue as well—then it would be invisible. What you need to do is define a class for your sidebar text, then assign a CSS style to that class. To create a paragraph of the sidebarclass, first add a classattribute to the opening tag: p { color: #0000FF; } <p class="sidebar"> This text will be white, as specified by the CSS style definition below. </p>
9. CSS Selectors Class Selectors Now we can write the style for this class: This second rule uses a class selector to indicate that the style should be applied to any element of the sidebar class. The period indicates that we’re naming a class—not an HTML element. p { color: #0000FF; } .sidebar { color: #FFFFFF; }
17. Redundant Units for Zero Values The following code doesn't need the unit specified if the value is zero. It can be written instead like this: Don't waste bytes by adding units such as px, pt, em, etc, when the value is zero. The only reason to do so is when you want to change the value quickly later on. Otherwise declaring the unit is meaningless. Zero pixels is the same as zero points. padding:0px 0px 5px 0px; padding:0 0 5px 0;
18.
19. Excess Whitespace Usually we have tendency to include whitespace in the code to make it readable. It'll only make the stylesheet bigger, meaning the bandwidth usage will be higher. Of course it's wise to leave some space in to keep it readable.
